html5浮动div关闭,div浮动之后排在一行，在把浮动去掉，把div用display设置成inline-block之后就不能排在一行了。...

去的浮动设置成行级块元素就不能正常布局了。求解

浮动设置的布局源码

*{margin:0; padding:0; }

.wrapper {width:980px; margin:20px auto 0; border:1px solid #ccc; }

.header {height:74px; background:#A94E38; text-align:center;line-height:74px;}

.left {width:200px; background:#eee;height:400px;}

.right {width:200px; background:#eee;height:400px;}

.content {width:580px;height:400px; background:green; float:left; }

.left {float:left;}

.right{float:left;}

.footer {height:50px; background:#7082C2;text-align:center;line-height:50px; clear:both; }

header

left

content

right

footer

去掉浮动设置成inline-block后的代码

*{margin:0; padding:0; }

.wrapper {width:980px; margin:20px auto 0; border:1px solid #ccc; }

.header {height:74px; background:#A94E38; text-align:center;line-height:74px;}

.left {width:200px; background:#eee;height:400px;}

.right {width:200px; background:#eee;height:400px;}

.content {width:580px;height:400px; background:green; display:inline-block; }

.left {display:inline-block;}

.right{display:inline-block;}

.footer {height:50px; background:#7082C2;text-align:center;line-height:50px; }

header

left

content

right

footer