Html <div> overflow:auto 在调整大小之前不显示滚动条
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/1273394/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
<div> overflow:auto does not show scrollbar until resize
提问by DaveK
I have a element on my form that looks like this:
我的表单上有一个元素,如下所示:
<div style="overflow-y:auto;overflow-x:hidden;height:100%;width:100%">
In IE7 when the page first renders, there are no scrollbars. However, if I resize the page (even just 1 pixel) the scroll bars appear properly.
在 IE7 中,当页面第一次呈现时,没有滚动条。但是,如果我调整页面大小(即使只有 1 个像素),滚动条会正确显示。
Is there something I can do so that the scrollbars show properly when the page first displays?
有什么我可以做的,以便滚动条在页面首次显示时正确显示?
回答by mothmonsterman
Set overflow-y to "scroll" if you always want a scrollbar.
如果您总是想要滚动条,请将溢出-y 设置为“滚动”。
回答by Baztoune
That's the kind of problem which comes from the hasLayout bug in IE6 and IE7. It affects how IE renders the page. To get rid of the problem, you should consider reading this great page about the hasLayout behavior and its hacks. There's also the official Microsoft hasLayout dedicated page.
这就是 IE6 和 IE7 中的 hasLayout 错误导致的问题。它会影响 IE 呈现页面的方式。为了摆脱这个问题,你应该考虑阅读这个关于hasLayout 行为及其 hacks 的很棒的页面。还有官方的Microsoft hasLayout 专用页面。
The hacks suggested are height: 0;
and zoom: 1;
depending on the version of IE you want to target and the type of your element.
建议的黑客是height: 0;
和zoom: 1;
根据IE的你想要的目标和版本的元素的类型。
回答by Baztoune
You should add margin-right: 20px to your style, so the scrollbar will have enoguh place to be displayed.
你应该在你的样式中添加 margin-right: 20px ,这样滚动条就会有足够的地方可以显示。
回答by src1996
I used overflow: scroll and it fixed my issue with the disappearing scrollbar on load. My tables are dynamically created and should scroll automatically when the page loads as I have enough data to start with.
我使用了溢出:滚动,它解决了我在加载时滚动条消失的问题。我的表格是动态创建的,当页面加载时应该自动滚动,因为我有足够的数据开始。
I didn't have to make any other changes. Now it works in all three browsers IE7, IE8 and FF.
我不必进行任何其他更改。现在它适用于所有三个浏览器 IE7、IE8 和 FF。
回答by Sam
Try Internet Explorer 9
and see if your current script works there. Most probably it does work there, and if so, you might rethink your inner desire to make it all compatible with previous versions of Internet Explorers like 7 etc
尝试Internet Explorer 9
看看您当前的脚本是否在那里工作。很可能它确实在那里工作,如果是这样,您可能会重新考虑您内心的愿望,使其与以前版本的 Internet Explorer 兼容,例如 7 等
With Chrome and FireFox stealing away audiences from IE to fast, I forecast that its only a matter of time that before such questions will be obsolete...
随着 Chrome 和 FireFox 迅速从 IE 中抢走观众,我预测这些问题将被淘汰只是时间问题......
回答by Kyle
try absolute widths and heights, upon resize IE7 may be calculating the dimensions itself when you go to resize to page, whereas on page load it isnt...
尝试绝对宽度和高度,在调整大小时 IE7 可能会在您调整页面大小时计算尺寸本身,而在页面加载时它不是......