5

在此处输入图像描述 在此处输入图像描述

如何使左边框与右边框的高度相同?换句话说,如何改变边框的顺序?左边框比右边框高。这会导致 1px 的“间隙”。

.tab-header > ul > li
{
display: inline-block;
background-color: #ffffff;
border-bottom: 1px solid #ffffff;
border-left: 1px solid #cecece;
border-right: 1px solid #cecece;
border-top: 1px solid #cecece;
padding: 8px;
font-size: 10px;
text-transform: uppercase;
}
4

3 回答 3

4

正在发生的事情是,css 试图在边框中做出漂亮的对角线颜色变化。如果您将所有更改1px10px,您会看到问题。(图片见:http: //jsfiddle.net/DaTCy/1/

在此处输入图像描述

如果您使用 1px 宽度的边框,底部和右侧边框将始终在右下角像素重叠。


编辑:作为一种解决方案,您可以尝试将底部边框的宽度设为 0px,并解决放置按钮的容器中的高度问题。

于 2012-05-13T13:37:12.530 回答
2

最简单的解决方案是显式使用:

border-bottom-width: 0;

JS 小提琴演示

于 2012-05-13T13:45:04.167 回答
0

border-left/-top/-rightandborder-bottom用于不同的[嵌套] 元素。

于 2012-05-13T13:41:04.780 回答