将div宽度设置为不带内联块的内容

Question

我想将div的宽度设置为其内容并将div保持在彼此之下。使用display:inline-block有效地使div彼此相邻。我怎么能这样做？

Answer 1

Working jsFiddle Demo

考虑以下标记：

<div class="text">apple</div>
<div class="text">banana</div>
<div class="text">kiwi</div>
<div class="text">orange</div>

浮动并清除所有，这是CSS：

.text {
    background: yellow;
    float: left;
    margin-bottom: 3px;
    clear: both;
}

Answer 2

说清楚：对他们而言，这将使他们不会浮动，是的，你确实需要漂浮“某事”

#div1, #div2{

    display: inline;
    float: left;
    clear: both;
    border: 1px solid grey;

}

<div id="div1">some content here that is bigger</div>
<div id="div2">some content here</div>