[CSS] Div avec height à 100%

Div avec height à 100% [CSS] - HTML/CSS - Programmation

Marsh Posté le 27-06-2003 à 09:51:51    

Bonjour, voila j'ai un div qui ressemble à ça:

Code :
  1. <div style="width: 520px;  height: 100%;  border-bottom-width: 0px;  border-top-width: 0px;  border-left-width: 1px;  border-right-width: 1px; left: 50%; margin-left: -260;"></div>


 
L'interet c'est que sur toute la hauteur du navigateur ce div me trace deux lignes verticales et ça marche plutot pas mal.
 
Il y a un seul probleme ( au moins sur IE pour l'instant j'ai testé que la dessus), quand la fenetre du navigateur est trop petite pour faire apparaitre toute ma page et qu'il y a donc une scrollbar, les lignes sont biens tracées sur la partie visible mais dès que je scrolle vers le bas elles n'y sont plus.
 
Qu'est ce que j'ai fait de pas bon?
Merci d'avance.

Reply

Marsh Posté le 27-06-2003 à 09:51:51   

Reply

Marsh Posté le 27-06-2003 à 10:04:05    

Sans doute un bug de IE...
 
Ajoute à <body> une hauteur de 100%, peut être que ça aidera...
 
 
PS : n'oublie pas les unités (cf margin-left)


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

Marsh Posté le 27-06-2003 à 10:17:48    

Bon bin j'ai essayé sur Mozilla même resultat, j'avais déjà un height à 100% dans mon body donc ça venait pas de la.
Ah oui j'avais oublié de préciser que toutes mes divs sont en absolutes peut-être cela influence sur quelque chose.
 
Y-a-til un autre moyen de faire ça?


Message édité par anapajari le 27-06-2003 à 10:19:18
Reply

Marsh Posté le 27-06-2003 à 10:18:22    

Reply

Marsh Posté le 27-06-2003 à 10:40:55    

Reply

Marsh Posté le 27-06-2003 à 10:56:31    

Mouais. En fait c'est un peu logique.
 
Tes DIV sont en position absolue => Ils n'ont donc aucune influence sur la hauteur de BODY (c'est comme si BODY ne contenait rien).
 
Vu que tu imposes à BODY une hauteur de 100% il faut bien qu'on sache à quoi se réfèrent ces 100%. Et comme BODY ne contient rien, le navigateur prend 100% de la zone de visualisation.
 
Problème : si cette zone est moins haute que les 600px de .divFlash, les bordures de .divBorder s'arrêtent trop tôt.
 
 
Pourquoi tu ne donnes pas à .divBorder une hauteur de 600px ?


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

Marsh Posté le 27-06-2003 à 11:09:46    

c'est un peu ce que je craignais...
 
Donc pourquoi je ne spécifie pas la hauteur de divBorder et bien parce que si l'ecran affiche plus que 600px en hauteur les lignes s'arrêtent et donc ça fait pas ce que je veux. :)
 
Je vois deux solutions:
- mettre un background sur mon body, mais je trouve ça vraiment pas top et je risque de galérer à bien le centrer
- ne pas utiliser de positionnement absolute et placer tous mes divs dans divBorder, mais bon le positionnement relatif je suis pas fan.
 
D'autres idées?

Reply

Marsh Posté le 27-06-2003 à 11:12:49    

Je pencherais pour la première solution. Surtout si ton .divBorder n'est là qu'à des fins de décoration.
 
Et il n'est pas du tout difficile de centrer un fond : http://www.yoyodesign.org/doc/w3c/ [...] d-position
 


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

Marsh Posté le 27-06-2003 à 11:29:03    

Bon bin je vais faire ça même si à la base je voulais éviter d'avoir à utiliser une image ...
 
Merci pour tout et en particulier pour ce petit lien fort interessant.

Reply

Sujets relatifs:

Leave a Replay

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