Question

我正在使用HTML＆amp; amp; 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>

Answer 1

你正在使.content div 100％宽加5px。它导致滚动条的额外5px。

CSS Chrome Bug？显示水平滚动条@ 100％表格单元格

1 个答案: