28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J'ai un petit problème avec mon menu déroulant, tout fonctionne, sauf qu'il ne m'affiche qu'un "sous-menu" par menu alors que j'en ai mis plusieurs en liste dans le code HTML...
Qu'est ce qui ne va pas ?
Merci !

Mon CSS :
#menu ul {
	margin:0 auto;
	width:1050px;
	padding:0;
	list-style:none;
	text-align:center;
	display:block;
	position:relative;
	font-variant:small-caps;
	font-family:Helvetica, Geneva, sans-serif;
	font-size:15px;
	font-weight:bold;
}
#menu ul ul {
	width:20%;
	font-size:13px;
	list-style:none;
	margin-left:10%;
	padding:0;
	margin-top:-5px;
}

#menu ul li {
	float: left;
	width:25%;
	background-color: #00a0ff;
}
#menu ul li a {
	display: block;
	color: black;
	text-decoration: none;
	padding: 5px;
}
#menu ul ul li a {
	text-align:center;
}
#menu li a:hover {
	color: white;
}
#menu ul li ul {
	display: none;
}
#menu ul li ul li{
	width:100%;
}
#menu ul li:hover ul {
	display: block;
}
#menu li:hover ul li {
	float: none;
}
#menu li ul {
	position: absolute;
}
/*fix ie7*/
#menu {
	height: 50px;
}
Bonjour,

Est-il possible d'avoir une page de test en ligne (pour avoir accès à l'ensemble des codes, voir aux images) ?
6l20 a écrit :
Bonjour,

Est-il possible d'avoir une page de test en ligne (pour avoir accès à l'ensemble des codes, voir aux images) ?


Je travaille actuellement sur un site hors ligne mais ma "base" est ici
Quelques erreurs dans le HTML à corriger, rien de grave.
Pourquoi ne pas utiliser un Doctype HTML5 plutôt que le xHTML strict ?
Je ne trouve pas ces sous-menu très pertinents Smiley ohwell
Dans la mesure où chaque lien du menu conduit à une page spécifique, un lien de téléchargement sur ces pages devrait amplement être suffisant.
Néanmoins, même si ce n'est pas très ergonomique, cela fonctionne sous Safari, Firefox, Chrome, Opéra (versions à jour) sous Mac.

Sur quels navigateurs, OS rencontrez-vous un souci ?
6l20 a écrit :
Quelques erreurs dans le HTML à corriger, rien de grave.
Pourquoi ne pas utiliser un Doctype HTML5 plutôt que le xHTML strict ?
Je ne trouve pas ces sous-menu très pertinents Smiley ohwell
Dans la mesure où chaque lien du menu conduit à une page spécifique, un lien de téléchargement sur ces pages devrait amplement être suffisant.
Néanmoins, même si ce n'est pas très ergonomique, cela fonctionne sous Safari, Firefox, Chrome, Opéra (versions à jour) sous Mac.

Sur quels navigateurs, OS rencontrez-vous un souci ?


Je débute en HTML et CSS... Smiley decu
Oui ce site va partir à la poubelle, pas pertinent du tout même Smiley smile
Je rencontre un souci sur n'importe quel navigateur, lorsqu'il y a deux sous-menus, il ne s'en affiche qu'un sur mon site (on dirait que le deuxième est "caché") avec ce code HTML :
<div id="menu">
  <ul>
    <li> <a href="quisuisje.html">Qui suis-je ?</a>
      <ul>
        <li><a href="CVALICEPDF.pdf">Téléchargez CV français</a></li>
		<li><a href="ALICEENGRES.pdf">Téléchargez CV anglais</a></li>
      </ul>
    </li>
    <li> <a href="messervices.html">Mes services</a>
      <ul>
        <li><a href="X.html">Traductions</a></li>
      </ul>
    </li>
    <li> <a href="tarifsdelais.html">Tarifs & délais</a>
      <ul>
        <li><a href="XX.html">Tarifs</a></li>
	<li><a href="XXX.html">Délais</a></li>
      </ul>
    </li>
    <li><a href="mailto:xxxx@free.fr">Contact</a></li>
  </ul>
</div>

Modifié par Alouce (13 May 2014 - 16:17)
6l20 a écrit :
Et oui Smiley cligne
Maintenant, réfléchir à la pertinence de ce &quot;menu&quot; Smiley cligne


Là c'est mieux Smiley cligne

<div id="menu">
  <ul>
    <li> <a href="quisuisje.html">Qui suis-je ?</a>
      <ul>
        <li><a href="CVALICEPDF.pdf">Téléchargez CV français</a></li>
		<li><a href="ALICEENGRES.pdf">Téléchargez CV anglais</a></li>
      </ul>
    </li>
    <li> <a href="messervices.html">Mes services</a>
      <ul>
        <li><a href="">Traduction</a></li>
		<li><a href="">Révision-Relecture</a></li>
		<li><a href="">Rédaction</a></li>
      </ul>
    </li>
    <li> <a href="tarifsdelais.html">Tarifs & délais</a>
      <ul>
        <li><a href="CVALICEESP.pdf">Tarifs</a></li>
		<li><a href="CVALICEESP.pdf">Délais</a></li>
      </ul>
    </li>
    <li><a href="mailto:XX@X.fr">Contact</a>
      <ul>
        <li><a href="mailto:XX@X.fr">Courriel direct</a></li>
		<li><a href="devis.html">Demande de devis</a></li>
      </ul>
	</li>
  </ul>
</div>