html - box-sizing 问题：边框上的边框元素

Question

我在使用 box-sizing: border-box on aside element 时遇到问题。下面提供的屏幕截图。

以下是我网站上的代码片段：

HTML：

<aside>
     <h2 class="widgettitle">No active widgets</h2>
     There are no active widgets in this area.
</aside>
<aside>
     <h2 class="widgettitle">No active widgets</h2>
     There are no active widgets in this area.
</aside>
<aside>
     <h2 class="widgettitle">No active widgets</h2>
     There are no active widgets in this area.
</aside>
<aside>
     <h2 class="widgettitle">No active widgets</h2>
     There are no active widgets in this area.
</aside>

CSS：

#footer .top aside {
    float: left;
    margin-bottom: 30px;
    padding-right: 30px;
    width: 25%;
    box-sizing: border-box;
}

正如您在图像上看到的，填充仍然在盒子外面。Firebug 甚至没有在 CSS 检查器上显示 box-sizing 属性。

图片：http ://s24.postimg.org/x2vl2z1b8/scr.jpg

Answer 1

不幸的是，Firefox 是最后一个仍然需要前缀的浏览器box-sizing。只需在行-moz-box-sizing: border-box;前添加，它应该可以解决问题。box-sizing