28173 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

Je cherche une petite variante de la méthode définie dans la FAQ (http://forum.alsacreations.com/faq/#item57)
Une image vaut mieux qu'un long discours, je ne parviens pas à appliquer un height à 100% de la page à la colonne du menu sous IE...

http://www.sortirtomars.com/test_css/test_height.html

Alors bien sûr j'ai suivi ce qui a écris dans la FAQ, mais il semblerait que cela fasse un 100% de la fenetre du navigateur et non pas de la page.

Quelqu'un à une idée ?

Merci,
Gl0ubI.
Modifié par GloubI (15 Oct 2006 - 20:27)
Administrateur
Hello,

C'est le comportement normal et logique.

Pour rappel, le media Web n'est pas un média paginé contrairement au média d'impression, il ne sera pas possible de "restreindre" un affichage à 100% tout en rajoutant du contenu (hormis utilisation de la propriété "overflow").
C'est au concepteur d'adapter ses besoins au média et non l'inverse.
Ok, je me suis très mal exprimé Smiley confused . Lorsque je parlais de 100% de la page, je sous-entendais 100% du conténaire parent de la colonne de gauche (la verte), soit dans mon cas #page.

Je ne vois pas comment dire à IE de mettre 100% de hauteur de #page à #menu_gauche.

Avec Firefox et Opéra, le résultat est comme je l'attendais, mais sous IE...
Modérateur
bonsoir,

IE n'en demordera pas , si il a la facheuse habitude de confondre height et width avec min-width et min-height (pour le version inferieur a 7 ) , il ne reactualise pas les dimensions de reference , et celle ci reste de la hauteur de la fenêtre pour html si % , cela se repercute sur body et ainsi de suite , quand aux autre valeur , c'est la même chose en generale , si tu dit dans le css 150px et que le conteneur s'aggrandit au dela , la reference reste 150px , gné .... reste a avoir recours au js dans le css par exemple (en commentaire conditionnel) , cela donnerait pour #menugauche. height: expression(document.body.clientHeight -0 -29) . , ensuite il faudra refaire la même chose pour les autre elements qui suivrait la même logique , bah oui , pourquoi que ça seraiyt pas le menu qui depasse les 100% et pas le contenu ?

Maintenant comme te le Raphael plus haut , si tu veut "vraiment" imposé ce comportement a tout les medias qui ont un rendu visuel , tu vas devoir les reprendre un a un ....

Pour infos , pour les autres navigateurs recent en suivant la logique du positionnement absolue , le height:100% , n'est plus necessaire , exemple (toujours pour menugauche ):

	position: absolute;
	top: 0;
	left: 0;
	bottom:0;
	right:621px;

mais, donc , pour IE6 , il faudrait et a condition de js activé

height: expression(document.body.clientHeight  -0 -29);
	top: 0;
	left: 0;
width:141px;

IE 5 ? , netscape ? et les autres .... l'exercice est interessant .

la reponse de "comment faire pou IE" n'est peut-etre pas la solution envisageable aprés tout Smiley smile
++
Merci pour l'astuce javascript, ça fonctionne, mais j'ai du autoriser IE a executer nécessite quand même une activation "du contenu actif"...
Je vais repenser la structure pour contourner cette utilisation.

Pour la petite histoire, je suis en train de "convertir" un site avec une mise en page en tableau dans une mise en page CSS, avec un maximum de sémantique. C'est parfois pas évident avec les mauvaises implémantations CSS des navigateurs.

Le hic, c'est que j'ai le pied de page qui suit cette hauteur pour s'évaser vers le contenu, donc oui, pour "coller" au design, #menu_gauche doit descendre tout en bas de #contenu.
Après j'ai peut-être mal compris l'explication de Raphaël... Smiley decu
Bon finalement, j'ai résolu ma problématique en ajoutant une image répétée en background Smiley confused

En tout cas merci pour les explications concernant les comportement du height dans les navigateurs.

Gl0ubI.