CSS 问题 : why the 100% width plus 1px border fall in FF browser but not in Chrome?

Question

我使用 1140px cssgrid.net 框架，我在内容中使用 12 列，侧边栏使用 2 列，侧边栏使用 10 列并将 border-right: 1px 放在侧边栏中，为什么 10 列落在 FF 浏览器中而不是在克罗姆？ 标记:

<div id="sidebar" class="twocols"></div>
<div id="main_content" class="tencols"></div>

样式:

#sidebar { border-right: 1px solid red }

Answer 1

可能您必须为其定义box-sizing。它适用于所有浏览器。

#sidebar { 
  border-right: 1px solid red;
  -moz-box-sizing:border-box;
  -webkit-box-sizing:border-box;
  box-sizing:border-box;
 }