如何使一个父div自动调整到其子div的宽度

我试图让父div只与子div一样宽。自动宽度使父div适合整个屏幕。子div的宽度取决于它们的内容，所以我需要父div来做相应的调整。谢谢你的帮助！如何使一个父div自动调整到其子div的宽度

<div style='width:auto;'> 
     <div style="width: 135px; float: left;"> 
      <h4 style="padding-right: 5px; padding-left: 15px;">Column1</h4> 
      <dl style="padding-right: 5px; padding-left: 15px; margin-top: -8px; overflow-x: hidden;"> 
       <dd style="white-space: nowrap;">1</dd> 
       <dd style="white-space: nowrap;">2</dd> 
      </dl> 

      <h4 style="padding-right: 5px; padding-left: 15px;">Column1</h4> 
      <dl style="padding-right: 5px; padding-left: 15px; margin-top: -8px; overflow-x: hidden;">  
       <dd style="white-space: nowrap;">1</dd> 
       <dd style="white-space: nowrap;">2</dd> 
      </dl> 
     </div> 

     <div style="width: 135px; float: right;"> 
      <h4 style="padding-right: 5px; padding-left: 10px;">Column2</h4> 
      <dl style="padding-right: 5px; padding-left: 15px; margin-top: -8px; overflow-x: hidden;"> 
       <dd style="white-space: nowrap;">1</dd> 
       <dd style="white-space: nowrap;">2</dd> 
       <dd style="white-space: nowrap;">3</dd> 
      </dl> 
     </div> 
</div>

来源

2013-02-27 bradley4

你的内部<div>元素应该有可能同时为float:left。将尺寸自动分配为容器宽度的100％。尝试在容器div上使用display:inline-block而不是width:auto。或者可能是float:left该容器也适用于overflow:auto。取决于你究竟做了什么。

来源

2013-02-27 01:15:28 Madbreaks

感谢Madbreaks。制作左侧花车是我没有尝试的。 – bradley4 2013-02-27 01:19:15

当然可以。如果你觉得我帮了你的忙，请考虑提高我的答案，或者如果你觉得这是正确的，请接受它。 – Madbreaks 2013-02-27 01:21:03

我需要等5分钟才能接受它=） – bradley4 2013-02-27 01:23:02

父div（我假设最外面的div）是display: block并且将填满它的容器（在这个例子中是body）的所有可用区域。使用不同的显示类型 - inline-block可能是你要什么：

http://jsfiddle.net/a78xy/

来源

2013-02-27 01:16:55

如何使一个父div自动调整到其子div的宽度

回答

相关问题