【问题标题】:Set two floating <div>'s to same height将两个浮动 <div> 设置为相同高度
【发布时间】:2013-04-17 17:03:20
【问题描述】:

所以我又在 css 定位上苦苦挣扎了。

几分钟前,我发现浮动元素不会影响其父容器的高度。那么当所说的高度是动态的时,我如何设置两个浮动到相同高度的div's

小提琴

http://jsfiddle.net/qbaJ8/

如何将青色&lt;div&gt; 的高度设置为与动态填充的绿色高度相同?

【问题讨论】:

    标签: css dynamic css-float positioning


    【解决方案1】:

    添加这个css:

    html, body {
       height: 100%;
    }
    
    .start-page-wrapper {
        height: 100%;
    }
    
    .first-section {
        height: 100%;
    }
    

    Updated jsfiddle

    编辑

    或者,您可以将display: table 用于父元素,将display: table-cell 代替float: left 用于子元素。它在 IE7 中不起作用。 jsfiddle

    【讨论】:

    • 谢谢!我们可以说将这个备考添加到所有内容中是个好主意吗?
    • 不幸的是,我遇到的问题是只有在应用了溢出:隐藏时才有效。这再次导致框不显示它包含的每个元素
    • 是的。如果需要,您可以稍后覆盖,具体取决于您的需要。
    • 在这种情况下,我认为您需要使用 javascript。看看编辑。
    猜你喜欢
    • 2013-07-18
    • 1970-01-01
    • 1970-01-01
    • 2014-07-23
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2010-11-15
    • 1970-01-01
    相关资源
    最近更新 更多