Problème de rendu sur IE

[Cleden]

Salut,

Je cherche à mettre un menu css avec onglets en place sur le site http://www.voile-capsizun.com

Celui-ci s'affiche parfaitement sur Firefox mais présente des défauts important sur IE.

Voilà l'affichage normal:

Et l'affichage sous IE:

IE me rajoute donc une bordure sur l'onglet actif et me supprime la bordure du haut. D'autre part l'onglet n'a pas les mêmes dimensions.

Voilà mon code css

#menu a {
	color: #776655;
	font-weight: bold;
	padding: 5px;
	margin: 0px;
	text-decoration: none;
	border: 0px solid #C4C4C4;
}

#menu a.actif {
	background-color: #FFFFFF;
	border-bottom: 0px solid #C4C4C4;
	border-top: 1px solid #C4C4C4;
	border-left: 1px solid #C4C4C4;
	border-right: 1px solid #C4C4C4;
	}

#menu a.inactif {
	border-left: 1px solid #;
	border-right: 1px solid #;
	border-top: 1px solid #;
}

#menu a:hover {
	border-bottom: 0px dotted #C4C4C4;
	border-top: 1px dotted #C4C4C4;
	border-left: 1px dotted #C4C4C4;
	border-right: 1px dotted #C4C4C4;
}

#menu li {
	color: #776655;
	display: inline;
}

#menu ul {
	border-bottom: 1px solid #C4C4C4;
	height: 22px;
	margin: 0px;
	padding: 0px;
	margin-top: 0px;
	padding-top: 1px;
}

J'espère que quelqu'un pourra trouver une solution à mon problème.

Loïc.

Modifié 30 Mars 2005 par Cleden

[Compte supprimé]

J'ai exactement le même type de navigation sur le site "ski de randonnée" de ma signature, tu peux t'en inspirer (valid xhtml1.0,CSS2, rendu ow sur tous les navigateurs)

[MarvinLeRouge]

Salut,

J'ai l'impression que ta règle pour les liens inactifs contient des lignes non valides : la couleur sans valeur. Ceci dit, c'est peut-être sans rapport.

[Cleden]

Salut,

J'ai l'impression que ta règle pour les liens inactifs contient des lignes non  valides : la couleur sans valeur. Ceci dit, c'est peut-être sans rapport.

<{POST_SNAPBACK}>

Je ne pense pas. Je suis reparti à 0 à partir de ton exemple Jeroen. En fait, le "truc" était à chercher dans le position: relative. Je l'avais supprimé dans un premier temps avant de me rendre compte qu'il était indispensable pour que le border-bottom du <li> recouvre celui du <ul>.

Merci à vous deux,

Loïc.

[MarvinLeRouge]

Tiens

Pourtant, il me semblait qu'un contenu inline pouvait dépasser son conteneur via l'utilisation du padding

[thick]

Je ne sais pas si ça va résoudre ton problème, mais je voulais juste te signaler que quand tu assigne 0, tu ne devrais pas mettre d'unité. 0 = 0 dans toutes les unités

Exemple :

padding=0 au lieu de padding=0px

essaye car avec ce idiot de IE on ne sait jamais

[Loupilo]

Salut,

Chez moi, le problème est inverse.

IE :

Firefox :

Ceci dit, je n'ai pas eu le temps de me plonger dans le code pour trouver d'où vient le bogue...

À bientôt,

Loupilo.