Petit problème de barre de navigation

enlève les <li></li> et les <a></a> vides dans le html

rajoute

list-style-type:none;

dans #masthead #nav ul ou dans #masthead #nav ul li

les petits points sont en fait le point de commencement d'une ligne de liste !

tu as un doublon dans #masthead {} border-radius 2 fois

attention border radius n'est n'est pas pris en charge par tous les nagigateurs

voir cette page
https://www.alsacreations.com/tuto/lire/1300-css3pie-styles-css3-pour-internet-explorer.html

pieHTC se télécharge ici http://css3pie.com/download/

pieHTC applique les border radius (et autres) a IE inférieur à 9

--

Ben en tout cas il n'y a plus les petits points quand je vais voir la page

dans la page d'acceuil il y sont encore donc enlève les style css intégré à la page !!! balises <style type="text/css"> ...........</style>

essaie de vider le cache de ton navigateur

vérifie ton html il y a quelques erreur </body> au milieu des pages par exemple

bon vu que ton css est bourré d'erreur refais le en séparant chaque id ou class

et chaque élément (li ul a etc)

ex
#nav{} ---------------------->text-align:center; a rajouter
#nav a:hover{}
#nav ul{}
#nav li{}

#masthead{}
#mashead p {}

etc

evite de faire plusieurs déclaration identiques pour une meme ID

voila les erreurs

#section-content {
width: 900px;
margin: 0 auto;
background: transparent; ---> DOUBLON1

}
#section-content #zone-content-wrapper {
padding: 20px 10px;
background: #fff; -----> DOUBLON1
behavior: url(/sites/default/themes/club_penguin/css/pie/PIE.htc);

---->le behavior se place apres les boxshadow et consorts

position: relative\9; ----->relative\9; ???? retire le\9

box-shadow: 5px 10px 10px -7px #666666, -5px 10px 10px -7px #666666;
box-shadow prend 3 valeurs px et 1 valeur couleur
}
#section-content #zone-content-wrapper #zone-content {
background: #fff; --------------DOUBLON1

}

body { -----------------DOUBLON2
font-family: 'MyriadWebProRegular', sans-serif; -----> police inconnue des nav
}

a:link, a:visited {
text-decoration: none; }

#masthead { width: 900px;
height: 75px;
margin: 0 auto;
padding: 0;
position: relative;
border-radius: 10px 10px 0px 0px;
-------> rajoute les declaration pour autres navigateurs et pieHTC
background: #22a4f3;
}

#masthead #nav ul {
padding: 0;
margin: 0;
position: absolute;
width: 900px;
top: 25px;
left: 25px;
list-style-type:none;
}

#masthead #nav ul li {
float: left;
font-weight: bold;
list-style-type:none;
}

#masthead #nav ul li a {
display: block;
color: #fff;
padding: 5px 4px;
font-size: 15px;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
border-radius: 7px;
-------> rajoute pieHTC
}

#masthead #nav ul li a:hover {
background: #0370cb;
}

body { --------DOUBLON 2
font-family: 'MyriadWebProRegular', sans-serif;
}

a:link, a:visited {
text-decoration: none; }

#masthead2 {
width: 240px;
height: 30px;
margin: 0 auto;
padding: 0;
position: absolute;
border-radius: 30px;
-------> rajoute les declaration pour autres navigateurs et pieHTC
background: #CCCFFF;
}

#masthead2 #nav ul {
padding: 0;
margin: 0;
position: absolute;
width: 900px;
top: 0px;
left: 10px; }

#masthead2 #nav ul li {
float: left;
font-weight: bold;
}

#masthead2 #nav ul li a {
display: block;
color: #FFFFFF;
padding: 5px 4px;
font-size: 15px;
-moz-border-radius: 7px;
-webkit-border-radius: 7px;
border-radius: 7px;
-------> rajoute les declaration pour autres navigateurs et pieHTC
}

Voyant que tu as resolu le probleme un petit re merci ne ferais pas de mal

enlève les <li><a> </a></li><li><a> </a></li><li>
</li> c'est vide ca sert a rien
si ca decale tes li ajoute une valeur de margin

autre chose ta balise <section> n'est pas refermée par </section> dans ta page

--

Oui, un grand merci mais je n'ai pas vu de changement, même avec ce que tu m'as conseillé, ou pour les balises vides, je les utilisent pour faire des espaces (sûrement une mauvaise manière)...

Je te remercie vraiment beaucoup, j'ai réussi (grâce à toi) à résoudre un problème que j'avais depuis 2 mois !

Bonjour,

Si je peux me permettre ton code a de nombreux soucis, si je prends la page http://pitouille2.renseign.com/404/ par exemple.

Déjà il manque le doctype, le charset.

Ensuite dans l'ordre tu as mis (si j'enlève tout ce qui est dedans)

<html>
    <head>
    </head>
    <body>
    </body>
    <section>
    <div>
    <head>
    </head>
    des liens et du texte
    <body>
    </body>
    une image
</html>

Problèmes :

- il ne doit y avoir qu'une seule balise <head> et une seule </head>, elles doivent se trouver en haut du code (head voulant dire tête).
- il ne doit y avoir qu'une seule balise <body> et une seule </body>, la balise <body> devant se trouver juste après </head> (body voulant dire corps).
- il ne doit rien y avoir en dehors des balises <body></body> qui définit ce qui doit être affiché.
- tu ouvres un <section> qui tu ne fermes nulle part.
- tu ouvres un <div> que tu ne fermes nulle part.

En fait dans la balise head on doit trouver toutes les infos pour le navigateur (les infos de référencement, les codes javascript ...) et dans la partie body tout ce qui sera affiché (donc le contenu).

En regardant vite fait les autres pages c'est le même genre d'erreurs, avec même des pages (comme l'accueil) qui n'ont même pas de <head></head>.

Je te conseille de faire un tour sur ce site : http://validator.w3.org/ et de vérifier toutes tes pages, tu trouveras beaucoup de commentaires sur tes erreurs.

Bon courage :)