2011-10-10 9 views
0

J'ai mis en place un exemple jfiddle, et il semble que ma taille: 100%; ne fonctionne pas.hauteur: 100% css ne fonctionne pas

body, html 
{ 
    height:100%;  
} 

#full-wrap { 
    min-height:100%; 
    height: auto !important; 
    height:100%; 
    margin:0 0 -91px; /* 1 extra px from footer border */ 
    clear:both; 
    border:thin solid red; 
} 
.contentCenter { 
    min-height:100%; 
    height:100%; 
    width:300px; 
    margin: 0 auto; 
    clear:both; 
    border:thin solid blue; 

} 


.footer { 
    height:90px;width:100%; 
    border-top:1px #E8E8E8 solid; 
    clear:both; 
}  


<div id='full-wrap'> 
    <div class='contentCenter'> 
    </div> 
</div> 
<div class='footer'> 
</div> 

Quelqu'un peut-il m'aider avec le problème? Comme vous pouvez le voir, la ligne de frontière (bleue) ne va pas à 100%.

+0

votre code est exact # full-wrap prendre 100% de hauteur mais pas son enfant – sandeep

Répondre

4
height: auto !important; 

Supprimer cette ligne et cela fonctionne.

+0

merci! questions rapides. si vous pouvez m'aider. J'ai une autre div, avec float: left. J'ai mis un flotteur à gauche parce que je devais être à côté d'un autre div, mais je me demandais s'il était possible de régler la hauteur: 100% avec un flotteur à gauche? Merci! – hellomello

+0

nvm, j'ai compris! Merci beaucoup! – hellomello

1

La hauteur de votre div #full-wrap parent est height:auto, vous devez spécifier une hauteur pour que votre div divise à 100%, définissez-le à 100% ou une hauteur fixe. Rappelez-vous, la hauteur basée sur le pourcentage est relative à son conteneur.