28172 sujets

CSS et mise en forme, CSS3

Problème d'alignement icone et texte

Salut à tous j'ai un problème lorsque je met une icône dans mon menu déroulant, cela décale mon contenu légèrement vers le bas voici mon code:

html:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />

<link rel="stylesheet" href="style.css" />

<header>
<div id="fond">
<div id="contenu">
<h1><center>BIENVENUE SUR LE SITE COMBUST-HOME</center></h1>
</div>
</div>
</header>
<title>Combust-Home</title>

</head>

<body id="Test">

<div id="menu">
<div id="Navmenu">

<ul>
<li><a href="#">Accueil</a></li>
</ul>

<ul>
<li><a href="#">Présentation</a>
<ul>
<dl>
<li><a href="#">Entreprise</a></li>
<li><a href="#">Personnels</a></li>
<li><a href="#">Produit</a></li>
</dl>
</ul>
</li>
</ul>

<ul>
<li><a href="#">Produit</a></li>
</ul>

<ul>
<li><a href="#">Photos</a>
<ul>
<li><a href="#">Systèmes de production d'énergie</a></li>
<li><a href="#">Réservoir de dihydrogène</a></li>
<li><a href="#">Canalisation</a></li>
<li><a href="#">Electrolyseur</a></li>
<li><a href="#">Convertisseur d'énergie</a></li>
<li><a href="#">Pile à combustible</a></li>

</ul>
</li>
</ul>

<ul>
<li><a href="#"><img src="mail.jpg" border="0" alt="mail">Contacts</a>
</li>
</ul>



</div>
</div>


</body>
</html>


puis CSS:

body#Test
{
background:url("neige.css.jpg");
}

#contenu
{
color: blue;
}

#Navmenu
{
margin:0;
padding:0;
margin-left:575px;
}



#Navmenu ul
{
margin:0;
padding:0;
line-height:30px;

}

#Navmenu li
{
margin:0;
padding:0;
list-style:none;
float:left;
position:relative;
background:#778899;

}

#Navmenu ul li a
{
text-align:center;
font-family:"Comic Sans MS",cursive;
text-decoration:none;
height:30px;
width:150px;
display:block;
color:#FFF;
font-size:20px;
border:1px solid #FFF;
text-shadow:1px 1px 1px #000;

}


#Navmenu ul ul
{
position:absolute;
visibility:hidden;
top:32px;

}

#Navmenu ul ul li a
{
width:350px;
}

#Navmenu ul ul dl a
{
width:150px;

}

#Navmenu ul li:hover ul
{
visibility:visible;

}

#Navmenu li:hover
{
background:#09F;
}

#Navmenu ul li:hover ul li a:hover /*lorsque la souris passe sur un sousmenu*/
{
background:#CCC;
color:#000;
}

#Navmenu a:hover /*lorsque la souris passe sur un menu*/
{
color:#000;
}
Sujet clos
Aller à