左侧固定宽度,右边自适应两列布局如何实现
问题 520
<!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>