html - div 宽度不适合子内容

Question

如何使用引导程序将 div 与其内容相匹配。

<div class="row-fluid">
  <div class="span12">
    <div style="<!--tried with inline-block float:left clear:left white-space:nowrap width:auto -->">
      <div class="span6">
        <table>
        </table>
      </div>
    </div>
  </div>
</div>

没有任何风格。请帮我..

Answer 1

我假设您正在使用的类是 twitter 引导程序，如果是这样，那么您的标记是错误的。

<div class="row-fluid">
  <div class="span12">
    <!-- span6 inside span12 will not use up 50% space unless it is the first child of a row --> 
    <div class="row-fluid"> 
      <div class="span6">
        <table>
        </table>
      </div>
    </div>
  </div>
</div>

此外， span* 是浮动的，因此除非它们位于“行”元素内，否则您需要使用 clearfix div

<div class="row-fluid">
  <div class="span12">
    <div style="<!--tried with inline-block float:left clear:left white-space:nowrap width:auto -->">
      <div class="span6">
        <table>
        </table>
      </div>
      <div class="clearfix"></div>
    </div>
  </div>
</div>

最后，您可以随时尝试在容器 div 上使用“overflow:hidden”，以使其适应其浮动的子项。