css height: auto non funziona

Question

L'INNER1 e INNER2 div sono all'interno del div esterno, ancora l'altezza di spettacoli esterni come 0px con altezza: auto

come raggiungere l'altezza di bambino elemento per il div esterno?

codice

<style> 
#outer { 
    width:300px; 
    height:auto;; 
    background:#ccc;  
} 
#inner1 { 
    float:left; 
    width:100px; 
    height:100px; 
    background:#f00; 
} 
#inner2 { 
    float:left; 
    width:100px; 
    height:100px; 
    background:#0f0; 
} 
</style> 
<div id="outer"> 
    <div id="inner1"></div> 
    <div id="inner2"></div> 
</div> 

Answer 1

Float div esterno. coprirà tutta la tua altezza, qualunque siano le div interne che tengono altezze. Ma se fornirai la proprietà del tuo div interno. allora io vi suggerisco di utilizzare la clearfix mod ..

/* Assuming this HTML structure: 

    <div class="clear"> 
     <div class="floated"></div> 
     <div class="floated"></div> 
     <div class="floated"></div> 
    </div> 
*/ 

.clear:before, .clear:after { 
    content: "\0020"; 
    display: block; 
    height: 0; 
    overflow: hidden; 
} 

.clear:after { 
    clear: both; 
} 

provare questo sarà sicuro che funzionerà

Answer 2

Aggiungere overflow:auto al div con id outer. Questo risolverà il tuo problema.

Demo