Div不占用iframe的高度

Question

请参阅此http://jsfiddle.net/7wt8L/1/

我尝试在div中嵌入iframe，我没有指定任何高度。我希望iframe能填满div，但div的底部还有一些空格。

我知道如何让div占据iframe的高度，但我很好奇为什么当我没有指定高度时，黄色div底部的空间为什么黄色的div。我也有点困惑的是，给iframe一个display:block的属性也允许div获取iframe的高度。

Answer 1

默认情况下，iframe为display: inline。内联元素可能会受到很多因素的影响，包括line-height，vertical-align等。尝试在iframe的父级上将line-height设置为0，您会看到边距将消失。 http://jsfiddle.net/7wt8L/2/

如果您不希望这些面向文本的属性影响您的元素，请改用display: block;。

Answer 2

默认情况下为display inline。

因此，如果你选择margin: auto;（因为你没有设置保证金，所以默认为margin : auto），你需要添加display: block;同样。

同样，要使自动边距生效，必须在iframe上设置显式宽度（你做过）。