css - 将 div 宽度设置为没有内联 block 的内容，并使 div 彼此居中对齐

Question

我想要一些 div 从它们的内容中获取它们的宽度。 Display:inline-block 执行此操作，但我还希望 div 彼此位于下方，而不是 float 时彼此相邻。

使用 float:left 而不是 inline-block 可以做到这一点，但我希望 div 居中对齐，而不是左对齐。我该怎么做？

Answer 1

在父 div 上放置 white-space: pre-line;在子 div 上添加 clear : both

#wrapper{ text-align: center; white-space: pre-line; }
#div1, #div2{

    display: inline-block;    
    clear: both;
    border: 1px solid grey;
    margin: 3px auto 3px auto;
    width: auto;

}

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

http://jsfiddle.net/judsonmusic/8HCWp/