column-count中列空白的问题

zjmttt · 发表于 2019-6-6 10:06:52

马上注册，结交更多好友，享用更多功能^_^

您需要登录才可以下载或查看，没有账号？立即注册

x

请问一下下面的代码中为什么会出现空白列

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>无标题文档</title>
<style>
.list{margin:0 ;padding:0;
-webkit-column-count:7; -webkit-column-gap:1px; -webkit-column-rule:1px solid #000;
width:1200px; height:45px;
border:10px solid black;
}
.list div{height:90px;width:150px;background:red;text-align:left;}
.list div a{width:40px;margin:0 0px; font:12px/30px "宋体"; text-align:left;display:inline-block;background:rgb(255,255,0)}
</style>
</head>
<body>
<div class="list">
<div>
<a href="#">新浪</a>
<a href="#">新浪</a>
<a href="#">新浪</a>
<a href="#">新浪</a>
<a href="#">新浪</a>
<a href="#">新浪</a>
<a href="#">新浪</a>
<a href="#">新浪</a>
<a href="#">新浪</a>
</div>
<div>
<a href="#">新浪</a>
<a href="#">新浪</a>
<a href="#">新浪</a>
<a href="#">新浪</a>
<a href="#">新浪</a>
<a href="#">新浪</a>
<a href="#">新浪</a>
<a href="#">新浪</a>
<a href="#">新浪</a>
</div>
<div>
<a href="#">新浪</a>
<a href="#">新浪</a>
<a href="#">新浪</a>
<a href="#">新浪</a>
<a href="#">新浪</a>
<a href="#">新浪</a>
<a href="#">新浪</a>
<a href="#">新浪</a>
<a href="#">新浪</a>
</div>
</div>
</body>
</html>

账号		自动登录	找回密码
密码			立即注册