100%Div导致儿童的底部边距被切断

时间:2012-06-07 19:01:25

标签: css margin

我有一个100%高度的#wrapper div。在其中我有几个内容div,每个都显示为内联块并具有底部边距。问题是这个底部边缘在某种程度上已经崩溃。

使用非常简单的代码可以看到问题:

<div id="wrapper">
    <div id="content">
        <!-- lots of content here that will fill the browser window -->
    </div>
</div>

我已经创建了一个示例,可以在这里看到:http://jsfiddle.net/Y6tJw/

我感觉这是一个webkit问题,因为Firefox和IE都会以适当的边距呈现页面。有什么帮助吗?

2 个答案:

答案 0 :(得分:0)

不要问我为什么会这样,但这将有效http://jsfiddle.net/Y6tJw/2/

风格

#wrapper { height: 100%; background: blue; }
#innerwrap { padding-bottom:300px; background: blue;}

HTML

<div id="wrapper">
<div id="innerwrap">
<div id="content">
    <!-- lots of content here that will fill the browser window -->
</div>
</div>
</div>

答案 1 :(得分:0)

这种情况正在发生,因为您使用min-height为身体提供了100%的身高。尝试给height:auto;这个'工作