Affichage d'un menu horizontal

Bonjour,

J'ai copié le tuto du menu horizontal en modifiant très peu de chose (positionnement top du menu).
Le problème c'est qu'en fonction des tailles d'écran le menu ne s'affiche pas correctement.
sur mon portable pas de problème, mais sur un autre ordinateur le menu est sur 2 lignes.
mon fichier css pour le menu

dl, dt, dd, ul, li {
margin: 0;
padding: 0;
list-style-type: none;
}
#menu {
position:absolute;
top: 7.0em;
margin-left:0.2em;
z-index:100;
width: 95%; /* correction pour Opera */
}


#menu dl {
float: left;
width: 13.1em;
}
#menu dt {
cursor: pointer;
text-align: center;
height:1.5em;
color:white;
border: 1px solid gray;
margin: 1px;
}
#menu dd {
display: none;
border: 1px solid gray;
color:white;
}
#menu li {
text-align: center;
background: #fff;
}
#menu li a, #menu dt a {
color: #000;
text-decoration: none;
display: block;
height: 100%;
border: 0 none;
}


#site {
position: absolute;
z-index: 1;
top : 70px;
left : 10px;
color: #000;
background-color: #ddd;
padding: 5px;
border: 1px solid gray; 
}

mon fichier css pour les autres mises en formes :

<style type="text/css">
<!--
body {
	background: white;
	padding:0;
	margin:0;
	color: black;
	position: relative;
	width: 100%;
	height: 100%;
	font-family: Tahoma; 
	font-size: 13px;
}
table {
	font-family: verdana; 
}
table.bordure {
	border: 1px solid gray;
    	border-collapse: collapse;
}
.trajout {
	height: 40px;
}

.td1 {
	text-align:center;
	font-family: verdana; 
	font-size: 12px;
}
.listef {
	font-family: verdana; 
	font-size: 10px;
}
.hidden {
    display: none;
}
.visible {
    display: inline;
}
.haut {
	height:8.8em;
	width: 95%;
	background-color: red;
	padding: 0px;
	margin-left:auto;
	margin-right:auto;
}

.frame {
	width: 95%;
	margin-left: 3.7em;;
	margin-top: 1em;
	height: auto;
	background-color: white;
	margin-left:auto;
	margin-right:auto;
}
.couleurfrs{color: #808080;}
-->
</style>
</head>

Est ce quelqu'un peut me dire ce qui ne va pas?

Merci d'avance

Salut,

Je n'ai pas regardé en détail mais c'est sans doute à cause de la largeur que tu donnes ici :

#menu dl {
float: left;
width: 13.1em;
}

Augmente là un petit peu et tout devrait rentrer dans l'ordre.

Si ce n'est pas le cas, une page en ligne serait utile pour te venir en aide.

Merci pour la réponse.

Pour le moment je n'ai rien changé car sur mon pc l'affichage est correcte.
voici le lien http://p.fontayne.club.fr

Pour le moment je m'attache plus au développement qu'au design

Koala64 me propose d'augmenter la taille de dl mais si je fais ça le menu s'affiche aussi sur 2 lignes


Une autre idée ??????

Bonsoir,

oui, valider ton code et le rendre un peu plus sémantique. Ton menu n'a rien à faire dans un formulaire.
Modifié par koala64 (26 Aug 2007 - 22:27)

Merci pour la réponse.

J'ai encore fait des modifs, le menu est bien sur une ligne mais je n'arrive pas à le centrer dans le div du haut

Allo !!! personne pour m'aider

Salut,

Ta page est toujours invalide (64 erreurs). Tant que ce n'est pas corrigé, tu ne peux, de toute façon, pas garantir le rendu.

Bonjour et merci pour la réponse.

J'ai fais les modifications.
Les erreurs restantes sont dues aux pages perso de club-internet.

Pour info, philippef,
ton menu ne fonctionne pas sous Safari (Mac)
la typo du menu horizontal principal est blanche... donc sur fond blanc, c'est problématique.
En espérant que cela t'aidera.