Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1727 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

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

 


 Mot :   Pseudo :  
 
Bas de page
Auteur Sujet :

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

n°637559
antsite
Je me souviens
Posté le 10-02-2004 à 15:45:14  profilanswer
 

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

mood
Publicité
Posté le 10-02-2004 à 15:45:14  profilanswer
 

n°637566
Hermes le ​Messager
Breton Quiétiste
Posté le 10-02-2004 à 15:46:58  profilanswer
 

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

n°637577
antsite
Je me souviens
Posté le 10-02-2004 à 15:52:04  profilanswer
 

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; ...

n°637595
Hermes le ​Messager
Breton Quiétiste
Posté le 10-02-2004 à 15:58:04  profilanswer
 

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.

n°637609
antsite
Je me souviens
Posté le 10-02-2004 à 16:02:00  profilanswer
 

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 !

n°637627
antsite
Je me souviens
Posté le 10-02-2004 à 16:05:28  profilanswer
 

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

n°639666
gm_superst​ar
Appelez-moi Super
Posté le 11-02-2004 à 22:28:28  profilanswer
 

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

Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

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

 

Sujets relatifs
[CSS] Probleme de couleurs de liens et scrolling barGestion de la mise en page avec des include...jarrive vraiment pas.
mise en page d'un site en php[PHP] Génération de page à la volée
CSS, DIVs, positionnement : IE va me rendre fou ...Rechercher un mot dans une page web distante
[CSS] Sur liste déroulante[CSS] cet effet possible en css ???
page de téléchargement[javascript] connaitre la position d'un element dans la page ?
Plus de sujets relatifs à : [XHTML/CSS] Une div de hauteur 100% de la page...


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR