边框框模型不知何故不起作用



这里真的很简单。为什么边框在框模型之外,尽管我选择了边框框?

<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

相关内容

最新更新