在中心显示幻灯片div

Question

我想在div标签的中心显示幻灯片放映,我将其标记为黑色.但现在它显示在左上角.

 .slide{background-image:url("samples.jpg") ;
        background-size: 100% ;
    background-repeat: no-repeat;
    height:500px; 
  border-style: solid;
    border-width: 5px;
 }
 .point_556492{
 padding:45px,0px;  
border-style: solid;
    border-width: 5px;
   float: center;
   height:150px;
   border-style: solid;
    border-width: 5px;
    width:50%;
 }

<div class="slide">
       <div class="point_556492"> sample</div>
             
     </div>  

Answer 1

假设你垂直和水平居中div .

注意......这适用于任何大小的内部div.

.slide {
    background-image:url("samples.jpg");
    background-size: 100%;
    background-repeat: no-repeat;
    height:500px;
    border-style: solid;
    border-width: 5px;
    position: relative;
}
.point_556492 {
    position: absolute;
    top:50%;
    left:50%;
    transform:translate(-50%, -50%); /* add your required prefixes */
    padding:45px 0px;
    border-style: solid;
    border-width: 5px;
    /* float: center; no such property */
    height:150px;
    border-style: solid;
    border-width: 5px;
    width:50%;

}

<div class="slide">
    <div class="point_556492">sample</div>
</div>