投稿

左侧固定宽度,右边自适应两列布局如何实现

江山如画 问题 979

<!doctype html>
<html>
<head>
<meta charset=\”utf-8\”>
<title>左侧固定宽度,右边自适应两列布局如何实现|www.125jz.com</title>
<style type=\”text/css\”>
/*左浮动固定宽度,右边margin-left*/
.container .left{
float: left;
width: 200px;
background-color:#090;
}
.container .right{
margin-left: 100px;
background-color:#F00;
}
/*清除浮动*/
.container:after{
content: “”;
height: 0;
line-height: 0;
display: block;
visibility: hidden;
clear: both;
}
</style>
</head>

<body>
<div class=”container”>
<div class=”left”>左侧</div>
<div class=”right”>右侧</div>
</div>
<span class=”container”></span>
</body>
</html>

回复

共1条回复 我来回复
  • 江山如画的头像
    江山如画
    这个人很懒，什么都没有留下～
    评论

    html:
    <div class=”0″>
    <div class=”1″>1</div>
    <div class=”2″>2</div>
    </div>

    css:

    .0{

    display:flex;

    }

    .1{

    flex:none;
    width:200px;

    }

    .2{

    flex:1;

    }

    5年前 0条评论

相关问题