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

即使在最大化浏览器窗口后我仍然显示滚动条（我认为应该没有理由）。当浏览器最大化时显示滚动条：CSS

这里没有高度问题，所以垂直滚动条不应该正确吗？

任何人都可以点亮一下吗？

<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>

来源

2013-05-14 user1967701

你有#wrapper与10px margin和height 100%。那会自动给你带来问题。删除10px页边距并将其应用于包装的内部内容。

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; }

来源

2013-05-14 00:12:19

谢谢你们两位！这解决了它。但是，我只是好奇地想知道为什么会这样，因为没有足够的内容来保证首要的滚动条。 – user1967701 2013-05-14 15:38:20

因为高度100％意味着使元素的高度相对于父元素达到100％。如果父母是窗口，那么它将填满屏幕。然后添加一个10px的边距 - 说明你的方式意味着在顶部和底部添加10px。你现在有100％的高度加20px – 2013-05-14 15:50:54

THanks Kai。这有帮助。 – user1967701 2013-05-14 16:32:29

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

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

来源

2013-05-14 00:14:48 Sachin

谢谢你们两位！这解决了它。但是，我只是好奇地想知道为什么会这样，因为没有足够的内容来保证首要的滚动条。 – user1967701 2013-05-14 15:38:50

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

回答

相关问题