HTML menu déroulant

Fermé
Isa__ Messages postés 55 Date d'inscription samedi 10 septembre 2005 Statut Membre Dernière intervention 14 octobre 2011 - 19 mai 2010 à 08:37
cire69 Messages postés 22 Date d'inscription mardi 15 juin 2010 Statut Membre Dernière intervention 3 mars 2011 - 19 juin 2010 à 23:00
Bonjour,

J'ai besoin d'un peu d'aide, je coince un peu..
J'ai un joli menu déroulant dans une cellule de tableau, mais pas moyen de le centrer ni d'éviter le bord en bas, je voudrais qu'il colle bien au bas de la cellule.

Visible ici : https://www.hugedomains.com/domain_profile.cfm?d=belpois&e=com

Voici mon code :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title>Page title</title>
<style>
#menu ul {
margin:0;
padding:0;
list-style-type:none;
text-align:center;
}
#menu li {
float:left;
margin:auto;
padding:0;
background-color:lightgrey;
}
#menu li a {
display:block;
width:200px;
color:black;
text-decoration:none;
padding:5px;
}
#menu li a:hover {
color:red;
}
#menu ul li ul {
display:none;
}
#menu ul li:hover ul {
display:block;
}
#menu li:hover ul li {
float:none;
}
#menu li ul {
position:absolute;
}
#menu {
height:50px;
}
</style>
</head>
<body bgcolor="lightgrey">
<table border=1 width=80% align=center bgcolor=white>
<tr><td>&nbsp;</td><td align=center><div id="menu">
<ul>
<li><a href="index.html">Accueil</a></li>
<li><a href="#">Contact</a>
<li><a href="#">Réalisations</a>
<ul>
<li><a href="#">Bois</a></li>
<li><a href="#">Aluminium</a></li>
</ul>
<li><a href="#">Situation</a>
<ul>
<li><a href="#">Plan</a>
<li><a href="#">Itinéraire</a>
<li><a href="#">Photos</a>
</ul>
</ul>
</div></td></tr>
<tr><td colspan="2">logo</td></tr>
<tr><td>menu2</td><td>corps</td></tr>
<tr><td colspan="2">mentions</td></tr>
</table>


</body>
</html>


Merci de votre aide !!!


Isa

A voir également:

4 réponses

joshu@ Messages postés 4 Date d'inscription mardi 8 juin 2010 Statut Membre Dernière intervention 19 juillet 2010
15 juin 2010 à 18:21
je n'ai pas de réponse directe mais je te conseil de suivre ce cours: https://openclassrooms.com/fr/courses/1603881-apprenez-a-creer-votre-site-web-avec-html5-et-css3#ss_part_3
0
cire69 Messages postés 22 Date d'inscription mardi 15 juin 2010 Statut Membre Dernière intervention 3 mars 2011 2
Modifié par cire69 le 15/06/2010 à 20:47
bonjour Isa,

je ne vois pas de tableau dans ta source !
mais tu n'en as pas besoin, c'est bien comme c'est !
pour centrer ton menu, tu dois y mettre un margin auto et surtout une largeur !
comme ça :

#menu {  
height:20px;  
margin:0 auto;  
width:500px;  
}



j'ai mis 30px à ton menu en hauteur, ça correspond mieux ! ;)

quand au fait de "d'éviter qu'il ne colle trop en bas" je ne sais pas si tu parle de ton sous menu ou de ton menu !
si c'est le sous menu, tu dois rajouter un margin-top, comme ça :

#menu ul li ul {  
display:none;  
margin-top:1px;  
}


et si tu veux un exemple de sous menu avec transparence en css, visite celui que j'ai fais :
http://www.cireasy.com/menu-deroulant-en-css/

j'espère avoir pu t'aider ! ;)
0
Isa__ Messages postés 55 Date d'inscription samedi 10 septembre 2005 Statut Membre Dernière intervention 14 octobre 2011 2
19 juin 2010 à 18:58
Super, merci cire69, ça marche impeccable... Ton menu en transparence est vraiment super, bravo...
Dommage que IE ne l'affiche pas, mais c'est pas grave, je n'utilise que Firefox, tant pis pour les autres.

Merci à tous de vos réponses...
0
cire69 Messages postés 22 Date d'inscription mardi 15 juin 2010 Statut Membre Dernière intervention 3 mars 2011 2
19 juin 2010 à 23:00
ravis que cela te plaise ;)

juste pour dire qu'il marche avec IE, c'est juste avec les versions inférieur à IE6 que ça marche pas, sinon avec IE 7 et IE 8 pas de soucis !
0