css浮动元素居中，右边宽固定而左边宽自适应

标签：浮动   nbsp   ack   div   position   black   lock   inline   html   

   1、浮动元素居中

   固定宽高的情况下：

width:200px;
height: 200px;
position: absolute;
left:50%;
top:50%;
margin-left: -100px;
margin-top: -100px;

未知宽高的情况下：

width:200px;
height: 200px;
position: absolute;
left:50%;
top:50%;
transform:translate(-50%,-50%);

2、右边宽固定，左边宽自适应
html：

<div class="all">
    <div class="left"></div>
    <div class="right"></div>
</div>

css：

.all{
    display: flex;
}
.left,.right{
    height: 2px;
    display: inline-block;
}
.right{
    width:200px;
    background: red;
}
.left{
    width:calc(100% - 200px);
    background: black;
}

css浮动元素居中，右边宽固定而左边宽自适应

标签：浮动   nbsp   ack   div   position   black   lock   inline   html   

原文地址：http://www.cnblogs.com/LingZi-0214/p/6727888.html