[XHTML/CSS] Une div de hauteur 100% de la page...

Une div de hauteur 100% de la page... [XHTML/CSS] - HTML/CSS - Programmation

Marsh Posté le 10-02-2004 à 15:45:14    

Salut,
Comment peut-on faire une div qui recouvre toute la surface visible du navigateur ? Sans passer par le JS ça serait bien...
ALors évidemment height:100% ne marche pas parce que la hauteur du conteneur de cette div (body) n'est pas définie...
merci
   ANT

Reply

Marsh Posté le 10-02-2004 à 15:45:14   

Reply

Marsh Posté le 10-02-2004 à 15:46:58    

Ben 100% de quoi du body non ?
 
Alors donc :
 
html,body {height : 100%; }
 
puis .nom-du-div {height : 100%; }

Reply

Marsh Posté le 10-02-2004 à 15:52:04    

ah nickel merci !
juste penser à mettre margin: 0px; dans le html, body pour ne pas avoir la scroll dans firefox, et c'est bon.
 
Mais maintenant j'aimerais écrire un mot au milieur de cette div. En horizontal c'est bon, text-align:center, mais en vertical, vertical-align: middle ne marche pas, même avec un display: table-cell; ...

Reply

Marsh Posté le 10-02-2004 à 15:58:04    

antsite a écrit :

ah nickel merci !
juste penser à mettre margin: 0px; dans le html, body pour ne pas avoir la scroll dans firefox, et c'est bon.
 
Mais maintenant j'aimerais écrire un mot au milieur de cette div. En horizontal c'est bon, text-align:center, mais en vertical, vertical-align: middle ne marche pas, même avec un display: table-cell; ...


 
Non.  :o  On ne peut pas centrer autre chose que du texte dans un div. C'est la merde. Ya que des magouilles plus ou moins infames qui permettent de s'en sortir.
 
Conclusion :  
 
Un site n'a pas de "hauteur". Elle dépend du navigateur, des extensions installées, des barres d'outils etc...
 
Donc soit tu utilises une cellule de table pour centrer verticalement, soit tu ne centres pas, et tu revoies la conception même de ton site. C'est comme cela que je procède quant à moi.

Reply

Marsh Posté le 10-02-2004 à 16:02:00    

ok bon je vais voir avec un table.
Mais le truc que je souhaite faire est tout simple, afficher un "Loading..." en milieu de browser, mon site n'a pas de hauteur si on veut, ça dépend des borwsers très bien, je veux juste écrire ce mot en milieu de page quoi, complètement relatif aux barres, etc...
On peut centrer en horizontal je vois pas pourquoi on peut pas en vertical, y a bien une scroll aussi en horiz, etc...
 
enfin merci bien !

Reply

Marsh Posté le 10-02-2004 à 16:05:28    

ouais avec un table c'est fait en 2 minutes, ça vaut pas le coup de s'embêter avec un div...
:hello:

Reply

Marsh Posté le 11-02-2004 à 22:28:28    

Si tu connais la hauteur de ton texte (ce qui est le cas vu qu'il n'y a qu'un "Loading..." ) tu peux utiliser ce mode de positionnement :
 
http://incongru.webdynamit.net/CentrageVertical
 
 
À adapter un peu à ton cas :
 
<div id="loading">Loading...</div>
 
#loading {
  position: absolute;
  width: 100%;
  height: 1.2em;
  top: 50%;
  margin-top: -0.6em;
  text-align: center;
}
 
 
Plus simlpe qu'un tableau non ?


Message édité par gm_superstar le 11-02-2004 à 22:31:35

---------------
Incongru : une FAQ abandonnée sur les Standards du Web - FAQ périmée de blabla@Prog
Reply

Sujets relatifs:

Leave a Replay

Make sure you enter the(*)required information where indicate.HTML code is not allowed