Je suis en train de restructurer mon site en XHTML Strict. J'aurais une petite question par rapport à cette page : http://www.cityloisir.com/home/sport-ligue1.html . Comment faire pour que le tableau s'affiche sous la barre avec l'onglet "Classement" sous Firefox. Le résultat s'affiche correctement sous IE, mais pas sous Firefox. COmment résodre le problème ?
J'ai isolé les éléments qui posent problème dans cette page : http://www.cityloisir.com/essai.html . Sous firefox, le tableau n'apparait pas sous le <div id="onglets">......</div>, il apparaît à droite des onglets
Le problème est illustré ci dessous. Le tableau dont je parle est entouré en rouge :
Résultat sous IE (affichage correct) :
Résultat sous Firefox (avec le problème) :
Voici le code CSS des onglets :
CODE
#onglets {
float : left;
width : 100%;
margin-bottom:10px;
background : url("img/onglet_bg.gif") repeat-x bottom;
font-size : 93%;
line-height : normal;
}
#onglets ul {
margin : 0;
padding : 10px 0px 0;
list-style : none;
}
#onglets li {
display : inline;
margin : 0;
padding : 0;
}
#onglets a {
float : left;
background : url("img/onglet_left.gif") no-repeat left top;
margin : 0;
padding : 0 0 0 9px;
border-bottom : 1px solid #999;
text-decoration : none;
}
#onglets a span {
float : left;
display : block;
background : url("img/onglet_right.gif") no-repeat right top;
padding : 5px 6px 4px 1px;
font-weight : bold;
color : #808080;
}
#onglets a span {
float : none;
}
#onglets a:hover span {
color : #333;
}
#onglets #current a {
background-position : 0 -150px;
border-width : 0;
}
#onglets #current a span {
background-position : 100% -150px;
padding-bottom : 5px;
color : #333;
}
#onglets a:hover {
background-position : 0% -150px;
}
#onglets a:hover span {
background-position : 100% -150px;
}
. Comment faire pour que l'affichage soit le même que sous IE ? (c'est à dire que le tableau s'affiche sous les onglets).
D'avance merci pour votre aide.
