如何使父div的自动大小到其子div的宽度 [英] How to make a parent div auto size to the width of its children divs

问题描述

我想让父div只有和孩子div一样宽。自动宽度使父div适合整个屏幕。 children divs将根据它们的内容而有不同的宽度，所以我需要父div来相应地调整。谢谢你的帮助！

I'm trying to make the parent div only as wide as the child div's. Auto width is making the parent div fit the entire screen. The children divs will be different widths depending on their content so I need the parent div to adjust accordingly. Thanks for your help!

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

推荐答案

您的内部< div> ; 元素应该可能都是 float：left 。将大小自动分割为其容器宽度的100％。尝试在容器div上使用 display：inline-block 而不是 width：auto 或者可能 float：left 容器并应用 overflow：auto 。取决于你到底是什么。

Your interior <div> elements should likely both be float:left. Divs size to 100% the size of their container width automatically. Try using display:inline-block instead of width:auto on the container div. Or possibly float:left the container and also apply overflow:auto. Depends on what you're after exactly.

这篇关于如何使父div的自动大小到其子div的宽度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！