html - 导航栏 div 边框偏离中心

Question

我有一个导航栏：

HTML：

<div id="navbar">
</div>

CSS：

#navbar{
    width: 100%;
    height: 50px;
    background-color: #F0F0F0;
    border-color: #B2B2B2;
    border-style: solid;
    -webkit-border-radius: 16px;
    -moz-border-radius: 16px;
    border-radius: 16px;
}

出于某种原因，边框使它偏离中心，div 的左侧总是有一些空间，但右侧没有。我该如何解决这个问题？？？

Answer 1

width: 100%从您的 CSS 中删除。是块级的div，所以会占用所有可用的水平空间。添加一个明确的 100% 只会在你给它时引入问题，padding或者在这种情况下，border

Answer 2

添加边框宽度和 CSS3 框大小以解决此问题。

border-width:2px;
-moz-box-sizing:border-box;
-webkit-box-sizing:border-box;
box-sizing:border-box;

http://jsfiddle.net/ADwwP/1/