border-box模型不知何故不起作用

Question

这里真的很简单。虽然我选择边框，为什么边框外的边框？

<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/

Answer 1

显然box-sizing仅适用于块级元素。

删除inline block（改为使用float），宽度包括边框。

演示： http://jsbin.com/aFoyITA/1/edit