我正在搞乱来自CSS Tricks的this代码示例,并且我试图将三个标签宽度设置为容器宽度的33%,以便三个标签均匀地覆盖容器的顶部。我知道您可以使用display:block设置标签的宽度,但标签会开始切入容器。如何在不损坏容器的情况下调整宽度?
答案 0 :(得分:2)
这是一个解决方案小提琴:http://jsfiddle.net/qEwef/
基本上:
.tab {
float: left;
width:33%;
display:block;
margin-top:-12px;
}
.tab label {
background: #eee;
padding: 10px;
border: 1px solid #ccc;
margin-left: -1px;
position: relative;
left: 1px;
display:block;
}
选项卡上的margin-top将退出选项卡标签上存在的填充/边框。