Menu horizontal en CSS
Résolu
Lili_754
Messages postés
137
Statut
Membre
-
Lili_754 Messages postés 137 Statut Membre -
Lili_754 Messages postés 137 Statut Membre -
Bonjour à tous,
Je rencontre un petit souci sur ma page de style, je souhaite que mon menu soit horizontal hors là il se place l'un après l'autre.
Voici ma feuille de style CSS:
.header {
background:#CC9999;
height:35px;
}
.container {
width: 960px;
margin: 0 auto;
}
.logo{
background:url(img/logo.png)no-repeate;
display: block;
float:left;
width:89px;
height:54px;
}
.wrap{
width:960px;
margin:0 auto;
}
.menu{
width:202px;
height:35px;
margin:0 auto;
}
.menu.ul.li{ !! c'est ici que je pense qu'il y a un problème !!
float:left;
text-decoration:none;
}
<html>
<head>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="header">
<div class="wrap">
<a href="s" class="logo"> Logo </a>
</div>
<div class="menu">
<ul>
<li> <a href="s">Paris</a></li>
<li> <a href="s">Rome</a></li>
<li> <a href="s">Barcelona</a></li>
</ul>
</div>
</div>
</body>
</html>
Merci d'avance
Je rencontre un petit souci sur ma page de style, je souhaite que mon menu soit horizontal hors là il se place l'un après l'autre.
Voici ma feuille de style CSS:
.header {
background:#CC9999;
height:35px;
}
.container {
width: 960px;
margin: 0 auto;
}
.logo{
background:url(img/logo.png)no-repeate;
display: block;
float:left;
width:89px;
height:54px;
}
.wrap{
width:960px;
margin:0 auto;
}
.menu{
width:202px;
height:35px;
margin:0 auto;
}
.menu.ul.li{ !! c'est ici que je pense qu'il y a un problème !!
float:left;
text-decoration:none;
}
<html>
<head>
<link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div class="header">
<div class="wrap">
<a href="s" class="logo"> Logo </a>
</div>
<div class="menu">
<ul>
<li> <a href="s">Paris</a></li>
<li> <a href="s">Rome</a></li>
<li> <a href="s">Barcelona</a></li>
</ul>
</div>
</div>
</body>
</html>
Merci d'avance
1 réponse
-
Bonjour,
>> .menu.ul.li{ !! c'est ici que je pense qu'il y a un problème !!
Tout à fait! Pour appliquer un style à des balises enfants à partir de la classe parent (.menu), il ne faut pas mettre de point devant les balises enfants, donc :.menu ul li { float: left; text-decoration: none; }
ça ne résoudra peut-être pas ton problème, mais autant faire une correction pas à pas...
