[HTML/CSS] Texte décalé dans mon menu
Résolu
Bonjour,
Je fais appel à vous concernant mon petit problème de décalage du texte dans le menu de mon site.
La situation est que j'ai un CV numérique à établir en codant en HTML/CSS. Lorsque la fenêtre du navigateur est agrandit à la résolution de l'écran, aucun problème le texte est bien aligné. Cependant si l'on réduit la taille de cette fenêtre, le texte se retrouve décalé sur la droite.
Je vous propose ce screenshot, qui me parait plus parlant.
https://imageshack.com/
Concernant mon code :
CSS :
ul#menu li {display:inline; float:left; padding:20px; margin:0px; margin:0 auto;}
ul#menu a {display:inline; height:40px; width:155px;text-align:center;text-decoration:none; color:black;}
ul#menu a:hover{color:red; text-decoration:underline; font-style:italic}
HTML :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CV Numérique - Accueil</title>
<link href="style.css" type="text/css" rel="stylesheet"/>
</head>
<ul id="menu">
<li id="menu_accueil"><a href="index.html"><span><b>Accueil</b></span></a></li>
<li id="menu_diplomes"><a href="diplomes.html"><span><b>Diplômes</b></span></a></li>
<li id="menu_competences"><a href="competences.html"><span><b>Compétences</b></span></a></li>
<li id="menu_exppro"><a href="exppro.html"><span><b>Expérience professionnelle</b></span></a></li>
<li id="menu_divers"><a href="divers.html"><span><b>Centre d'intérêts</b></span></a></li>
</ul>
<body>
<div id="centrer">
<div id="header"></div>
<div id="corps_accueil"></div>
<div id="footer"></div>
</div>
</body>
</html>
PS : mon code était indenté, il ne l'est plus .. désolé
Si vous avez besoin d'autres informations sur mon code, pas de problème, demandez-moi !
Je vous remercie d'avance.
MrJack83
Je fais appel à vous concernant mon petit problème de décalage du texte dans le menu de mon site.
La situation est que j'ai un CV numérique à établir en codant en HTML/CSS. Lorsque la fenêtre du navigateur est agrandit à la résolution de l'écran, aucun problème le texte est bien aligné. Cependant si l'on réduit la taille de cette fenêtre, le texte se retrouve décalé sur la droite.
Je vous propose ce screenshot, qui me parait plus parlant.
https://imageshack.com/
Concernant mon code :
CSS :
ul#menu li {display:inline; float:left; padding:20px; margin:0px; margin:0 auto;}
ul#menu a {display:inline; height:40px; width:155px;text-align:center;text-decoration:none; color:black;}
ul#menu a:hover{color:red; text-decoration:underline; font-style:italic}
HTML :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CV Numérique - Accueil</title>
<link href="style.css" type="text/css" rel="stylesheet"/>
</head>
<ul id="menu">
<li id="menu_accueil"><a href="index.html"><span><b>Accueil</b></span></a></li>
<li id="menu_diplomes"><a href="diplomes.html"><span><b>Diplômes</b></span></a></li>
<li id="menu_competences"><a href="competences.html"><span><b>Compétences</b></span></a></li>
<li id="menu_exppro"><a href="exppro.html"><span><b>Expérience professionnelle</b></span></a></li>
<li id="menu_divers"><a href="divers.html"><span><b>Centre d'intérêts</b></span></a></li>
</ul>
<body>
<div id="centrer">
<div id="header"></div>
<div id="corps_accueil"></div>
<div id="footer"></div>
</div>
</body>
</html>
PS : mon code était indenté, il ne l'est plus .. désolé
Si vous avez besoin d'autres informations sur mon code, pas de problème, demandez-moi !
Je vous remercie d'avance.
MrJack83
Configuration: Windows XP Firefox 3.0.10
