浮动元素水平居中

1 宽度不固定的浮动元素

    <div class="outerbox">  
     <div class="innerbox">我是浮动的</div>  
    </div>  
    .outerbox{  
    float:left;   
    position:relative;   
    left:50%;   
    }   
    .innerbox{    
    float:left;   
    position:relative;   
    right:50%;   
    }  

2 宽度固定的浮动元素

<div class="outerbox">  
   <div>我是浮动的</div>  
</div> 
    .outerbox{  
        background-color:pink; /*方便看效果 */    
        width:500px ;   
        height:300px;
        margin: -150px 0 0 -250px; /*使用marin向左移动250px,保证元素居中*/  
        position:relative;   /*相对定位*/  
        left:50%;  
        top:50%;  
    }  
原文地址:https://www.cnblogs.com/by-dxm/p/6417488.html