2009-08-13 7 views
2

J'ai une conception de site à trois colonnes et une colonne et j'aimerais que le contenu du centre soit redimensionné pour correspondre au reste de la colonne (hauteur de écran - (pied de page codé en dur + hauteur de l'en-tête codée en dur)). Y a-t-il une manière mignonne de faire ceci avec le CSS? Si non, comment puis-je accomplir cela avec javascript?Redimensionner dynamiquement la hauteur de div en fonction de la taille/résolution du moniteur de l'utilisateur

Merci,

Tom

#container { 
    background-color: gray; 
    height: 100%; 
} 
#centercolumn { 
    background-color: white; 
    margin-left: auto; 
    margin-right: auto; 
    width: 800px; 
    height: 100%; 
} 
#header { 
    background-color: blue; 
    height: 150px; 
} 
#content { 
    background-color: yellow; 
} 
#footer { 
    height: 50px; 
    background-color: blue; 
} 

<html> 
    <head> 
    <link rel="stylesheet" href="test.css" type="text/css" media="screen"/> 
    </head> 
    <body> 
    <div id="container"> 
     <div id="centercolumn"> 
     <div id="header"> 
      header 
     </div> 
     <div id="content"> 
      content 
     </div> 
     <div id="footer"> 
      footer 
     </div> 
     </div> 
    </div> 
    </body> 
</html> 

Répondre

Questions connexes