将div宽度设置为不带内联块的内容,并将div保持在彼此中心对齐的位置

Question

我想要一些div来从他们的内容中获取他们的宽度.显示:内联块执行此操作,但我也希望div在彼此之下,而不是彼此相邻,因为浮动.

使用float:left而不是inline-block可以做到这一点,但我希望div是中心对齐的,而不是左对齐.我怎样才能做到这一点？

Answer 1

在父div上放白空:pre-line; 在孩子divs上添加明确:两者

#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/