首页 > 代码库 > css浮动元素居中,右边宽固定而左边宽自适应
css浮动元素居中,右边宽固定而左边宽自适应
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浮动元素居中,右边宽固定而左边宽自适应
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。