实现自适应两列布局

自适应布局

一共两列，左面的那一列弹性的，右面的那一列宽度是固定的200px。不允许使用flex布局

代码实现

css

#main,#sideBar{
	float: left;
	color: #fff;
}
#main{
	width: 100%;
	margin-right: -200px;
	background-color: #10375E;
}
#sideBar{
	width: 200px;
	background-color: #00B5EE;
}

html

<div id="main"><p>这是主体部分，弹性宽度</p></div>
<div id="sideBar"><p>这是侧栏部分，固定宽度</p></div>

缩小浏览器宽度，可以查看效果