我在练习过程中发现，在使用overflow属性时，出现了排版错误，当把该属性注释掉后排版就好了，求指教。这个是未加overflow的这个是加了overflow的，不知道为什么，它自己跑上来半截。代码如下：<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>用display：inline-block实现网格铺满浏览器</title>
<style type="text/css">
*{
margin: 0 aoto;padding: 0;
}
[class^=box]{
display: inline-block;/*转化为行内块*/
width: 200px;
height: 100px;
margin: 1em;
border: 2px solid #000;
border-bottom: 1px dashed #333;
}
.box1{
border: 2px dashed;
border-color: red yellow blue green;
overflow:auto;
}
.box2{
border-right: none;
}
.box3{
border-right-color: #b3b3b3;
}
.tip{
border: 1px solid #f55;
}
</style>
</head>
<body>
<div>
<p>我是一个行内块</p>
</div>
<div>
<p>我是一个行内块</p>
</div>
<div>
<p>我是一个行内块</p>
</div>
<div>
<p>我是一个行内块</p>
</div>
<div>
<p>我是一个行内块</p>
</div>
<div>
<p>我可没用清除浮动</p>
</div>
</body>
</html>
- 2 回答
- 2 关注
- 3403 浏览
相关问题推荐
添加回答
举报
0/150
提交
取消