Bonjour !
J'ai un problème de positionnement où je penche entre plusieurs solutions (mauvaises ?), et j'aimerais quelques avis éclairés
Voici tout d'abord un schéma de l'organisation de ma page :
Schéma global
Même schéma sur une page différente
Les flèches symbolisent l'adaptation du menu en fonction du corps : plus le corps est long, plus le menu doit descendre en restant collé au bas de page.
Supposons ici que ces trois blocs soient des images (une qui représente l'en-tete, une autre pour le corps, une pour le menu... )
J'ai tenté pour respecter cette mise en page différentes techniques mais elles marchent plus ou moins.
J'ai d'abord tenté de mettre le menu en position: absolute / bottom: 0 afin qu'il reste collé au bas de la page (le conteneur étant en position: relative bien sûr). Cependant, ce resultat etait plutot mal interpreté sous IE au premier chargement (un bug lié aux positions presque incurable, j'y ai passé des heures).
Une nouvelle idée m'est venue : pourquoi ne pas laisser tous ces blocs dans le flux normal, appliquer un float: right au corps ? Problème, le menu se place en dessous car étant une image, il prend toute la largeur de la page. Mais en mettant un margin-bottom : -350px (les 3/4 de la taille du menu environ) au corps, le menu remonte à la bonne place
Cependant, cette dernière solution est-elle vraiment "propre" ? Ne suis-je pas à l'abri d'un autre bug Internet Explorer à cause du float ou de la valeur négative du margin ?
J'aimerais votre avis sur la question, et si vous voyez une autre solution n'hésitez pas à m'en faire part !
Merci beaucoup et bonne journée,
Mishuu
J'ai un problème de positionnement où je penche entre plusieurs solutions (mauvaises ?), et j'aimerais quelques avis éclairés
Voici tout d'abord un schéma de l'organisation de ma page :
Schéma global
Même schéma sur une page différente
Les flèches symbolisent l'adaptation du menu en fonction du corps : plus le corps est long, plus le menu doit descendre en restant collé au bas de page.
Supposons ici que ces trois blocs soient des images (une qui représente l'en-tete, une autre pour le corps, une pour le menu...
)J'ai tenté pour respecter cette mise en page différentes techniques mais elles marchent plus ou moins.
J'ai d'abord tenté de mettre le menu en position: absolute / bottom: 0 afin qu'il reste collé au bas de la page (le conteneur étant en position: relative bien sûr). Cependant, ce resultat etait plutot mal interpreté sous IE au premier chargement (un bug lié aux positions presque incurable, j'y ai passé des heures).
Une nouvelle idée m'est venue : pourquoi ne pas laisser tous ces blocs dans le flux normal, appliquer un float: right au corps ? Problème, le menu se place en dessous car étant une image, il prend toute la largeur de la page. Mais en mettant un margin-bottom : -350px (les 3/4 de la taille du menu environ) au corps, le menu remonte à la bonne place
Cependant, cette dernière solution est-elle vraiment "propre" ? Ne suis-je pas à l'abri d'un autre bug Internet Explorer à cause du float ou de la valeur négative du margin ?
J'aimerais votre avis sur la question, et si vous voyez une autre solution n'hésitez pas à m'en faire part !
Merci beaucoup et bonne journée,
Mishuu