Hashem Qolam..
8
您可以将top/left重置border为0和使用top属性为负值margin-top以实现结果.
实际上,没有必要使用重置边框.
虽然边距会逐字地移动元素.
因此,您可以margin向.tag元素添加负顶部/左侧.但是,在最后一行的元素底部会有一个额外的边框.
为了将边界向上移动,您可以将虚拟子项附加到该元素中,并为该元素.tags-container使用负底部margin.
由于您
在.tags-container清除浮点数的最后使用了一个元素,因此您也可以将所需的负边距应用于该元素.
.tag {
float: left;
margin-top: -1px;
margin-left: -1px;
padding: 5px;
border: 1px solid #ff0000;
}
.tags-container div:last-child {
margin-bottom: -1px; /* This negative margin overlaps the bottom border */
}
或者,您可以使用::after伪元素作为.tags-container清除浮动的最后一个子元素并应用负边距:
.tags-container:after {
content: "";
display: block;
clear: both;
margin-bottom: -1px;
}
唯一不起作用的情况是当一行长于前一行时... http://jsfiddle.net/mendesjuan/ZpwxH/如果省略底部边框而不是你修复那个案例并打破原来的:) (2认同)