Come rendere una dimensione div genitore alla larghezza dei suoi figli div.

Sto provando a fare in modo che il genitore div divida solo quanto il div figlio. La larghezza automatica sta facendo div il genitore si adattano l'intero schermo. I div dei bambini avranno larghezze diverse a seconda del loro contenuto, quindi ho bisogno che il genitore div aggiusti di conseguenza. Grazie per l'aiuto!Come rendere una dimensione div genitore alla larghezza dei suoi figli 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>

fonte

2013-02-27 bradley4

vostro interno <div> elementi dovrebbero probabilmente essere entrambi float:left. Divs taglia al 100% la dimensione della larghezza del loro contenitore automaticamente. Prova a utilizzare display:inline-block anziché width:auto sul contenitore div. O forse float:left il contenitore e applicare anche overflow:auto. Dipende da cosa stai cercando esattamente.

fonte

2013-02-27 01:15:28 Madbreaks

Grazie Madbreaks. Fare entrambi i float lasciati è qualcosa che non ho provato. – bradley4

Sicuro. Se ritieni che ti ho aiutato a prendere in considerazione la mia risposta, o accettarla se ritieni che sia corretta. – Madbreaks

Ho bisogno di aspettare altri 5 minuti per accettarlo =) – bradley4

Il div genitore (presumo il div più esterno) è display: block e riempirà tutta l'area disponibile del suo contenitore (in questo caso il corpo) che può. Utilizzare un diverso tipo di visualizzazione - inline-block è probabilmente quello che si sta andando per:

http://jsfiddle.net/a78xy/

fonte

2013-02-27 01:16:55

Come rendere una dimensione div genitore alla larghezza dei suoi figli div.

risposta

Problemi correlati