css - Mozilla vs Chrome Div 宽度问题。计算与不计算边界？

Question

嘿伙计们，我的作业有一个小问题。我必须创建这个页面，它在 Chrome 中看起来很棒，但每个 div 单元格在 Firefox 中呈现小一个像素，我相信它与边框宽度有关。有解决方法还是我做错了什么？

我正在使用 CSS 重置，并且我已经声明了我的文档类型。

我应该使用表格来构建这个页面吗？抱歉，没有发布代码的链接，当我将代码放在代码块中时，它仍然显示 HTML。

提前致谢。

score 3 · Accepted Answer

Try using CSS outline that will also work. An outline is a line that is drawn around elements (outside the borders) to make the element "stand out".

However, the outline property is different from the border property.

The outline is not a part of an element's dimensions; the element's total width and height is not affected by the width of the outline.

ie.

.example {outline: 1px solid pink;}

score 1 · Accepted Answer

尝试使用 CSS 中的 box-sizing 属性来解决这个问题。box-sizing:border-box;将在元素的实际宽度和高度内渲染边框和填充。如需更好的描述，请查看此http://css-tricks.com/box-sizing/

2 回答 2