父div缩放到其中的内容

Question

我认为父div根据其中的内容自动缩放。 例如，我有一个div作为父内部，我有另一个div只有文本。当我通过firebug查看它时，显示父div一直延伸到浏览器。我认为它应该只延伸到内部div内部文本的长度。如何将父级缩放到内部而不是完整的浏览器宽度。

<div id="outter">
    <div id="inner">some empty text</div>
</div>

Answer 1

默认情况下，display:block（默认为div）的元素为100％宽度。 display: inline或inline-block元素将适合其内容。

Answer 2

<div>是一个块元素。尝试<span>，或<div style="display:inline"></div> ... <div style="float:left"></div>可能会产生类似的效果。

Answer 3

默认情况下，另一个内的div将与包含它的div一样大。因此，您必须将div的大小设置为“outter”，或者默认情况下它将是文档的100％

Answer 4

我想你会发现那些div都是：

display:block;

如果你这样做：

#outer, #inner {
    display:inline;
}

这两个元素只会与其内容一样宽。