CSS浏览器Bug？显示100%表格单元格处的水平滚动条_Css_Google Chrome_Css Tables

CSS浏览器Bug？显示100%表格单元格处的水平滚动条

css google-chrome

CSS浏览器Bug？显示100%表格单元格处的水平滚动条,css,google-chrome,css-tables,Css,Google Chrome,Css Tables,我只是在用HTML和CSS做我的第一步，但我想知道为什么Chrome会为我的以下代码显示一个水平滚动条，而它不应该显示。请注意，该条仅以特定的缩放级别显示。我想知道这是一个（已知的）错误还是我做错了什么？我目前的Chrome版本是26.0.1410.64。这是我的MWE： <!DOCTYPE html> <html> <head> <style type="text/css"> /* -----------

我只是在用HTML和CSS做我的第一步，但我想知道为什么Chrome会为我的以下代码显示一个水平滚动条，而它不应该显示。请注意，该条仅以特定的缩放级别显示。我想知道这是一个（已知的）错误还是我做错了什么？我目前的Chrome版本是26.0.1410.64。这是我的MWE：

<!DOCTYPE html>

<html>
    <head>
        <style type="text/css">
        /* -------------- Setting Default values -------------- */
html, body, div, form, fieldset, legend, label {
   margin: 0;
}

/*
@media screen and (-webkit-min-device-pixel-ratio:0) {
    body{
        margin-right: 0.05px;
    }
}
*/

nav.main_nav {
    display:table-cell;
}

 div.content {
    padding-left: 5px;  /* <-- important */
    display:table-cell;
    width: 100%;
}
        </style>
    </head> 

  <body>
        <nav class="main_nav">
            <ul>
                <li><a href="/">Home</a></li>
            </ul>
        </nav>

        <div class="content">
            <h2>Welcome</h2>
        </div>
  </body>
</html>


/*------------设置默认值------------------*/
html、正文、div、表单、字段集、图例、标签{
保证金：0；
}
/*
@媒体屏幕和（-webkit最小设备像素比：0）{
身体{
右边距：0.05px；
}
}
*/
主导航{
显示：表格单元格；
}
部门内容{
左填充：5px；/*您正在使.content div 100%宽加5px。正是这个额外的5px导致了滚动条。
您正在使.content div 100%宽加5px。正是这个额外的5px导致了滚动条。
那么，为什么hbar在所有缩放级别上都没有一致显示，而在FF或IE中根本没有显示？您如何让例如，如果使用背景色，内容单元格将填充整个hspace？是的，这就是为什么我在示例中将额外的5px注释为重要的原因…这并不能解释为什么右边距：0.05px
在所有缩放级别上为我解决了这一问题为什么hbar在所有缩放级别上都不一致，而在FF或IE中根本不一致？如何如果你使用背景色，你会让内容单元格填充整个hspace吗？是的，这就是为什么我在我的示例中将额外的5px注释为重要的原因…这并不能解释为什么margin right:0.05px
在所有缩放级别上都为我解决了这个问题