这里真的很简单。为什么边框在框模型之外,尽管我选择了边框框?
<div class="tabswitch">
<a href="#" class="active">Text 1</a>
<a href="#" class="">Text 2</a>
</div>
.tabswitch a {
border: 5px solid #333;
padding: 10px 46px;
display: inline-block;
box-sizing: border-box;
}
.tabswitch a.active {
background-color: #00f;
color: #fff;
border: none;
}
http://jsfiddle.net/DgFZZ/2/
显然box-sizing
仅适用于块级元素。
删除inline block
(改用浮点数),宽度包括边框。
演示:http://jsbin.com/aFoyITA/1/edit