Bonjour,
Ce message fait suite au post suivant:
centrer un div
Cependant je souhaiterai le diriger plus sur IE6, donc je recrée un post.
Je suis débutant en PHP/MySQL et aussi XHTML et donc CSS... ;-)
Je programme en TXT sous Linux(Ubuntu).
Donc, mon site ressemble à ça:
- Un header et un footer,
- Un "menu" (float-left, width:150px),
- Un "main" (extensible),
- Un "panier de sélection" (float-right, width:150px).
Mon problème est que je voudrait poser un DIV de taille fixe à l'intérieur du "main" et le centrer, comme ça, suivant les définitions utilisées ça reste +/- équillibré comme design mais je peux l'optimiser pour le 1024.
J'ai donc utilisé la technique de la "marge négative pour la moitier de la taille du DIV" et du positionnement relatif + left:50%.
Ca marche très bien pour FF, Opera. Lorsque je diminue la taille de la fenêtre, le DIV passe sous les fenêtres et j'ai droit à une "barre d'overflow", donc c'est PARFAIT.
PROBLEME:
Sous IE6/Win, comme d'hab, ça foire!
En fait ça centre bien, mais lorsque l'on réduit la taille de la fenêtre, le DIV centré passe SUR les DIV de "menu", "panier de sélection" et "footer", ce qui est fort gênant!! :-(
Tout ce passe comme si IE6 prenait le DIV centré comme "absolute" au navigateur et non "relative" au DIV conteneur du DIV centré!!!
Je ne comprends pas la logique de ce comportement d'IE...
J'ai essayé de jouer avec des z-index mais ça ne change rien du tout.
Alors après 2 jours de recherche infructueuse je me tourne vers plus expérimenté que moi! :-)
=====================
Voici le CSS de mon div à centrer:
#view_villa_topband
{
width: 674px;
height: 520px;
background: red;
color:#000;
margin-left: -337px;
position: relative;
left: 50%;
z-index: 10;
}
Et le CSS du DIV "main" qui le contient:
#main
{
height: 475px;
padding: 5px;
margin: 0px;
margin-left: 3px;
border: 2px solid blue /*#69c*/;
overflow: auto;
font-size: 95%;
line-height: 1em;
color:#000;
background-color: #d1f2f2;
text-align: justify;
}
Merci beaucoup de votre aide!
Bonne journée!
Feral
