4-5自己解决不了的问题

代码：

/*样式补充*/

div h3 {

margin: 0px;

padding: 0px;

}

h3 {

background-color: #edeeee;

font-weight: normal;

}

div {

margin: 0 auto;

text-align: center;

width: 100px;

}

.div1,

.div2,

.div3 {

display: inline-block;

border: 1px #d9dde1 solid;

width: 100%;

height: 25px;

}

ul {

list-style: none;

text-align: left;

display: none;

}

li {

margin: 0 auto;

padding-left: 30px;

line-height: 30px;

border-left: 1px #d9dde1 solid;

border-right: 1px #d9dde1 solid;

}

.div1:hover .elec {

display: inline;

}

.div2:hover .wash {

display: inline;

}

.div3:hover .clothes {

display: inline;

}

</style>

</head>

我的思路是不是错了？

我打算给.elec这些出现以后的列加一个边框标签，但是标签总是会出现在奇怪的地方。

我加了一个全边框的标签后发现，整个边框就像被撕裂了一样，不能组成一个闭合的矩形。

BruinK 2018-04-12

源自：盒子模型 4-7 编程练习

收起

1回答

一个bug不要慌回答被采纳获得+3积分 2018-04-12 19:22:51

建议在写css样式的时候,先设置一下padding:0 margin:0,如下图所示:

body ,ul, li ,p,h1~h6,dd,dt 等……都有默认的margin 或padding值的，加上这句就可以删除浏览器这些默认值，方便后面的样式设置。

收起回答

BruinK 提问者 #1

好的，解决了一部分的问题，我刚刚发现，第一个和第二个列表最下面的内边距不正常，贴住了分类标签，是内边距合并的问题吗？我添加了overflow：hidden；还是没有解决。

2018-04-13 09:49:07
一个bug不要慌回复提问者 BruinK #2

你描述的我有点听不明白,你试一下把div盒子的高度不设置,有没有解决你的问题? .div1, .div2, .div3 { display: inline-block; border: 1px #d9dde1 solid; width: 100%; /*height: 25px;*/ }

2018-04-13 13:36:03
BruinK 提问者回复一个bug不要慌 #3

由于回复不能上图片，所以没有描述清楚。非常感谢，解决了，我再自己好好想想原因。

2018-04-13 15:45:13