当浏览器最大化时滚动条显示：CSS

Question

即使在我最大化浏览器窗口之后也会显示滚动条（我认为应该没有理由）。

此处没有高度问题，因此垂直滚动条不应该出现在右边？

任何人都能解释一下吗？

<style>
    html, body, div { margin: 0; border: 0 none; padding: 0; }
    html, body,form, #wrapper, #left, #right { height: 100%; min-height: 100%; }
    #wrapper { margin: 10px; overflow: hidden; width: 960px;  }
    #left { background: yellow; float: left; width: 360px; }
    #right { background: grey; margin-left: 360px; }
  </style>


  <div id="wrapper">
    <div id="left">
      Left
    </div>

    <div id="right"></div>
  </div>

Answer 1

#wrapper 10px margin和height 100% html, body, div { margin: 0; border: 0 none; padding: 0; } html, body,form, #wrapper, #left, #right { height: 100%; min-height: 100%; } #wrapper { overflow: hidden; width: 960px; } #left { margin: 10px; background: yellow; float: left; width: 360px; } #right { margin: 10px 10px 10px 360px; background: grey; } 。这会自动给你带来麻烦。删除10px边距并将其应用于包装器的内部内容。

{{1}}

Answer 2

只需从margin:10px移除#wrapper。

#wrapper
{ 
  /*margin: 10px; */
  overflow: hidden; 
  width: 960px;  
}