[CSS]Barre de menu apparaît à différents endroits

Statut
N'est pas ouverte pour d'autres réponses.

Arnoz

Touriste
Petit souci de mise en page sous IE (7?). J'ai fait mon site avec iWeb, par facilité, mais je préfèrais garder WordPress pour mon blog donc j'ai copié le design de iWeb pour WordPress. Seulement il semblerait que la barre de navigation du haut donne bizarrement sous IE7 et Firefox. Moi tout paraît OK pour Safari et Firefox.
Alors vous pourriez vérifier sir sur PC ça foire effectivement? Et si oui, quelqu'un sait me dire pourquoi?

Voici le code de la barre du haut:

Code:
#nav {
	font: 12px 'Courier New', Verdana, Arial, Sans-Serif;
	position: absolute;
	width: 700px;
	font-weight:bold;
	margin: 0px 0px 0px 290px;
	padding: 25px 0px 0px 0px;
	text-align: center;
	letter-spacing: 1px;
	color:#595959;
	}
#nav a {
	color: #595959;
	}
#nav a:hover {
	color: #ffffff;
	}
:arrow: http://blog.arnoz.be
 

eSb`

That's Poker!
Je sais pas si c'est très élégant comme manière de faire, je ne suis pas une star en css du tout : ).

Apparemment le problème vient du margin-left que tu imposes, qui est pris comme tu le veux sous Firefox mais qui s'ajoute au text-align: center, sous IE.

Donc j'ai enlevé ce margin-left si on est en présence d'IE :
#nav {
font: 12px 'Courier New', Verdana, Arial, Sans-Serif;
position: absolute;
width: 700px;
text-align: center;
font-weight:bold;
margin: 0px 0px 0px 290px !important;
padding: 25px 0px 0px 0px;
letter-spacing: 1px;
color: #595959;
margin: 0px 0px 0px 0px;
}
Ca marche sous IE 6, je ne sais pas vérifier sur IE 7 ; ).

En gros j'ai rajouté !important (que IE ne comprend pas) à la fin du premier margin et créé un second qui sera interprété par IE
 
1er
OP
A

Arnoz

Touriste
Merci. Quelqu'un pourrait confirmer que ça fonctionne sous IE7 ou Firefox?
En fait j'ai l'impression que ça donne bien chez moi avec ma résolution, mais dès que je checke sur un ordi avec une résolution différente, ça déconne...
 

eSb`

That's Poker!
C'est normal que ça déconne vu que tu fixes ton margin en pixels ; ). Donc si ta fenêtre est plus petite, il va de toute façon le mettre à 290px à partir de la gauche.

Essaie un truc comme ça :
#nav {
FONT: bold 12px 'Courier New', Verdana, Arial, Sans-Serif;
WIDTH: 700px;
COLOR: #595959;
PADDING-TOP: 25px;
LETTER-SPACING: 1px;
POSITION: absolute;
margin-left: -350px;
left: 50%;
}
http://css.alsacreations.com/Faire-...ux/Centrer-les-elements-ou-un-site-web-en-CSS
 
1er
OP
A

Arnoz

Touriste
Merci!
 
Statut
N'est pas ouverte pour d'autres réponses.
Haut