【CSS】一侧定宽，另一侧自适应的布局该如何去做

一侧定宽，一侧自适应的页面布局在现在用的很多，有哪些实现方式呢？

1,通过浮动和margin取正值来实现：

定宽的元素为#sidebar

自适应的元素为#content

css代码如下：

　　　　　给定宽的元素设置浮动

　　　　　　#sidebar{

　　　　　　　　　　float:left;

　　　　　　　　　　width:200px;  height:600px;

　　　　　　　　　　background-color:red;

　　　　　　　　　　}

　　　　　　自适应的元素呢？来给他设置margin-left吧，取值比上面那个元素的宽度大一些就好

　　　　　　#content{

　　　　　　　　　　width:100%; //如果是div块级元素的话，width不设也可以

　　　　　　　　　　height:600px;

　　　　　　　　　　margin-left: 210px;

　　　　　　　　　　background-color:black;

　　　　　　　　　　}

2,通过浮动和margin取负值来实现：

定宽的元素为#sidebar

自适应的元素为#content

css代码如下：

#content{

　　float:left;

　　width:100%;

　　height:600px;

　　margin-right:-200px;

　　background-color:black;

}

#sidebar{

　　float:left;

　　width:200px;

　　height:600px;

　　background-color:red;

}

原文地址：https://www.cnblogs.com/better2019/p/8724536.html