当前位置：首页 → 问答吧 → div如何竖着排列换行？？

div如何竖着排列换行？？

时间：2011-10-20

来源：互联网

比如现在有div是这样的效果

div
div
div
div
div
div
div
div

但是他不会换成第2排我要的效果是
div div
div div
div div
div div
div
div
div

这样如何实现貌似不会换到第2排呢

作者: lijing3333 发布时间: 2011-10-20

在列上定义一个大div，类为col。
先排列方向上的，再排行方向上的。

作者: KongHuLu 发布时间: 2011-10-20

float:left;width:50%;你试试

作者: rao3324180 发布时间: 2011-10-20

HTML code

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
.test,.test1{ float:left; border:1px solid #333333;}
</style>
</head>

<body>
<div class="test">
<div>111111111111111111</div>
<div>222222222222222222</div>
<div>333333333333333333</div>
<div>444444444444444444</div>
<div>555555555555555555</div>
<div>666666666666666666</div>
<div>777777777777777777</div>
</div>
<div class="test1">
<div>111111111111111111</div>
<div>222222222222222222</div>
<div>333333333333333333</div>
<div>444444444444444444</div>
</div>
</body>
</html>