2010-09-16 2 views
1

J'ai une page web avec un grand div (par exemple blanc) et une autre div qui suit la précédente. Le problème est que si le bloc blanc est assez grand et sa hauteur est presque ou même plus grande que la fenêtre du navigateur (et des barres de défilement apparaissent), le bloc rouge est dans le bas de la page il y a encore un écart entre div rouge et fin du fenêtre dans Firefox/Safari/Opera: alt textElliminer l'écart entre la dernière div et la fin de la page dans firefox/opera/Safari

Mais dans tout Explorer/Chrome est ok:

alt text

Mon code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> 
    <title></title> 
    <style type="text/css"> 
     root { display: block; } 

     html, body{ 
      padding: 0; 
      margin: 0; 
      width: 100%; 
      height: 100%; 
      font-family: Tahoma; 
      background-color: blue ; 
     } 

     #container{ 
      position: absolute; 
      left: 50%; 
      width: 961px; 
      height: 100%; 
      margin-left: -480px; 
     } 


     .infContainer{ 
      position: relative; 
      padding-left: 19px; 
      background-color: white; 
      color: #434343; 
     } 

     div#footerCopyright{ 
      position: relative; 
      bottom: 15px; 
      font-size: 0.75em; 
      background-color: red; 
     } 

     div#bottomFooterDivider{ 
      height: 50px; 
     } 


     div#pageBottomDivider{ 
      height: 35px; 
     } 
    </style> 
</head> 
<body> 
    <div id="container"> 

     <div id="mainBlock" class="infContainer"> 
      <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/> 
      <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/> 
      <br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/><br/> 
      <br/><br/><br/><br/><br/><br/> 
     </div> 


     <div id="footerCopyright"> 
      <div id="bottomFooterDivider"></div> 
     </div> 
    </div> 

</body> 
</html> 

Comment résoudre t son problème et avoir la même page sans trou bleu dans Firefox/Opera/Safari.

Page actuelle: http://109.74.203.141/stack/1/tmp.html

Répondre

1

Votre footerCopyright div est réglé sur position: relative; bottom: 15px;

Quand je mets le fond à 0, il aligne sur le fond de FF.

Questions connexes