请问怎么让它们另起一行显示？
来源：13-4 起飞咯 - 浮动模型
唯梦闲人
2015-11-29 14:24
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>怎么整？</title>
<style type="text/css">
#div1,#div2{
width: 300px;
height: 300px;
border:1px blue solid;
float: left;
}
#div3,#div4{
width: 300px;
height: 300px;
border:1px pink solid;
float: right;
}
#div5,#div6{
width: 300px;
height: 300px;
border:1px red solid;
}
#div5{float: left;}
#div6{float: right;}
</style>
</head>
<body>
<div id="div1">栏目one</div>
<div id="div2">栏目two</div>
<div id="div3">栏目three</div>
<div id="div4">栏目four</div>
<div id="div5">栏目five</div>
<div id="div6">栏目six</div>
</body>
</html>全都挤在一起了，不知道咋整才可以，求解？
写回答
关注
3回答
-
- 李晓健
- 2015-11-29 15:28:00
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <title>怎么整？</title> <style type="text/css"> #div1,#div2{ width: 300px; height: 300px; border:1px blue solid; float: left; } #div3,#div4{ width: 300px; height: 300px; border:1px pink solid; float: right; } #div5,#div6{ width: 300px; height: 300px; border:1px red solid; } #div5{float: left;} #div6{float: right;} .clearfix{overflow:auto;_height:1%} </style> </head> <body> <div class="clearfix"> <div id="div1">栏目one</div> <div id="div2">栏目two</div> </div> <div class="clearfix"> <div id="div3">栏目three</div> <div id="div4">栏目four</div> </div> <div class="clearfix"> <div id="div5">栏目five</div> <div id="div6">栏目six</div> </div> </body> </html> -
- echo_kinchao
- 2015-11-29 14:57:48
父元素 给定宽 不够宽度就会给挤下去 另起一行啦
-
- 李晓健
- 2015-11-29 14:49:01
你想要一个什么样的效果呢，你有浮动，会到一行是正常的呀。
初识HTML(5)+CSS(3)-升级版
HTML(5)+CSS(3)基础教程8小时带领大家步步深入学习标签用法和意义
1225817 学习 · 18235 问题
相似问题