首页   技术笔记   网址导航   Json在线解析   二维码   Ip地址查询   在线流程图  
新用户注册 | 会员登录
当前位置:  开发笔记 > 编程语言 > 正文

带溢出的DIV:自动和100%宽的桌子

作者：kikokikolove | 2023-09-04 19:14
如何解决《带溢出的DIV:自动和100%宽的桌子》经验，为你挑选了4个好方法。

我希望有人能够在这里帮助我.我尽力简化我的例子.

我有一个绝对定位的DIV,在这个例子中我填写了浏览器窗口.这个div有overflow:auto属性,当内容太大而无法显示DIV时提供滚动条.

在DIV中我有一个表来呈现一些数据,它的宽度是100%.

当内容垂直变得太大时,我希望显示垂直滚动条,并且表格略微水平缩小以容纳滚动条.但是在IE7中会发生的情况是水平滚动条也会出现,尽管div中的所有内容仍然有足够的水平空间.

这是IE特定的 - firefox工作得很好.

完整来源如下.任何帮助非常感谢.

托尼





    Table sizing bug?
    


    

    

        
This will be fine until such time as the vertical size forces a
           vertical scroll bar. At this point I'd expect the table to re-size
           to now take into account of the new vertical scroll bar. Instead,
           IE7 keeps the table the full size and introduces a horizontal
           scroll bar.
        

        

        
            

                A
                B
                C
                D
                E
                F
                G
                H
                I
                J
                K
                L
                M
                N
                O
                P
                Q
                R
            

        
        


        
Resize the browser window vertically so this content doesn't
           fit any more

        
Hello
Hello
Hello
Hello
Hello

        
Hello
Hello
Hello
Hello
Hello

添加03/16/10 ...认为可能有趣的是指出GWT的源代码在评论中指出了这个问题... http://www.google.com/codesearch/p?hl=en#MTQ26449crI /com/google/gwt/user/client/ui/ScrollPanel.java&q=%22hack%20to%20account%20for%20the%22%20scrollpanel&sa=N&cd=1&ct=rc&l=48



1> cetnar..：

我在IE7中遇到过度水平条的问题.我用D Carter的解决方案略有改变


   

      
要在低于7的IE浏览器中工作,您需要添加:




2> 小智..：
Eran Galperin的解决方案无法解释这样一个事实,即简单地关闭水平滚动仍然会让桌子重叠垂直滚动条.我假设这是因为IE在决定它需要一个垂直滚动条之前计算"100%"的含义,然后无法重新调整剩余的可用水平空间.
cetnar的解决方案在上面钉了它,但是:

   

      

   






        





      ...

这在我的测试中适用于IE6和7.据我所知,""黑客在IE6上似乎并不是必需的.

为了澄清任何不幸在2012年(或更晚些时候)进行调查的人:关键是让你的100%宽度表包含在带有hasLayout的元素中(例如,Joel的例子中的#myDiv,带缩放的div: 1触发hasLayout)滚动元素的INSIDE溢出:auto.这会导致IE在考虑垂直滚动条的宽度后重新排列表格的宽度.

3> Eran Galperi..：

更改:

overflow: auto;

至:

overflow-y:hidden;
overflow-x:auto;



4> 小智..：

好吧,这个让我困扰了很长时间.我做了太多设计,右边有额外的填充,允许IE完全忽略他们自己的滚动条.

答案是:嵌套两个div,给它们两个hasLayout,设置内部一个溢出.





   

      
http://www.satzansatz.de/cssd/onhavinglayout.html

 
去那里阅读有关布局的更多信息


    

        
推荐阅读

        

            
        

    


    

        

            
            

                
                    devbox
                
            


            

                kikokikolove            


            

                这个屌丝很懒，什么也没留下！            

            
            


                                
                    
                    关注作者
                            


        

    



    

        
Tags | 热门标签

        

            
        

    



    

        
RankList | 热门文章

        

            
        

    





    DevBox开发工具箱 | 专业的在线开发工具网站    京公网安备 11010802040832号  |  京ICP备19059560号-6 

    Copyright © 1998 - 2020 DevBox.CN. All Rights Reserved  devBox.cn 开发工具箱  版权所有