28173 sujets

CSS et mise en forme, CSS3

Bondour !

J'espère que vous pourrez m'éclairer, j'ai un problème d'imbrication de min-height, qui fait que, sous firefox, mon second bloc en min-height prend en height la valeur du premier bloc. Au secours, je me perds !

body{
   background : #ccc url('/images/body.png') repeat; 
   font-family: arial;
   font-size:100%;
   color:black;
   text-align: center ;
   height:100%;
}

#global{
    background: url('/images/global.png') top center no-repeat;
    height:1105px;
    width: 100%;
    
}
html>body #global{
    height: 100%;
    min-height:1105px;
}


#center{
    width:1000px;
    margin:0 auto;
    padding-left:66px;
    text-align: left;
    font-size:0.9em;
}

#container{
    background:#ccc url('/images/container.png') top center no-repeat; 
    height:838px; /* ie */
    width:1000px;   
}

html>body #container{
    height: 100%;
    min-height:838px;
}


<div id="global">
  <div id="center">
    <div id="header">
    </div>
     
    <div id="menu"></div>  
    
    <div id="container">
            <div class="content">
            </div>
    </div>
 </div>
</div>


PS : Très très très étrangement, IE m'affiche ce que je souhaite Smiley lol
Modifié par Kiwiwi (17 Aug 2012 - 12:45)