j'ai "suivi" le cours sur Kompozer sans trop de pb (il est très clair et progressif) mais arrivé à la fin de du cours n°4: " Un menu horizontal réactif avec HTML et CSS" j'ai un petit souci et j'aimerais qu'une bonne âme me vienne en aide...
Dans le résultat on devrait voir la première liste, c.a.d la ligne: "item1 item2 item3" collée au bord gauche or dans ce que j'obtiens elle reste avec une marge à gauche.
J'ai cru comprendre qu'il fallait utiliser un identificateur: "#menu ul" avec une marge à 0 qui devrait affecter uniquement cette liste et non pas la seconde: "une salade, etc..." mais ça ne fonctionne pas. Dans ce que j'ai fait, l'ajout de cet identificateur semble ne servir à rien. Un grand merci à celui qui voudra bien se pencher sur mon pb.
Voici le code de la page:
Code : Tout sélectionner
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta content="text/html; charset=ISO-8859-1"
http-equiv="content-type">
<title>MENU</title>
<style type="text/css">
#menu li {
border: 1px solid red;
list-style-type: none;
float: left;
text-align: center;
width: 100px;
margin-right: 5px;
margin-left: 5px;
}
#menu ul {
margin-left: 0px;
}
#menu a:visited {
color: #009900;
font-weight: bold;
text-decoration: none;
}
#menu a {
color: white;
background-color: #000099;
font-weight: bold;
text-decoration: none;
display: block;
}
#menu a:hover {
color: #000099;
background-color: red;
}
</style>
</head>
<body>
<h3> Mon menu</h3>
<ul id="menu">
<li> <a href="http://info.sio2.be/">Item 1</a>
</li>
<li> <a href="http://debian.fr/">Item 2</a>
</li>
<li> <a href="http://isnd.be/">Item 3</a> </li>
</ul>
<h4 style="clear: both;"> Liste de courses </h4>
<ul>
<li>Une salade </li>
<li>Du mou pour le <a
href="http://fr.wikipedia.org/wiki/Chat">chat</a> </li>
<li>Le journal </li>
</ul>
</body>
</html>