Vi do direttamente il codice HTML e CSS. Come posso allineare il sottomenu rispetto alla voce "secondo" del menu?. Grazie mille ragazzi., sono nuovo con la programmazione in HTML/CSS.
HTML:
<!DOCTYPE html>
<html>
<head>
<title>S.S.1</title>
<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="master">
<nav>
<ul id="menu">
<li><a href="#"><h3>Primo</h3></a></li>
<li><a href="#"><h3>Secondo</h3></a>
<ul class="submenu">
<li><a href="#"><h5>Sub 1.0</h5></a></li>
<li><a href="#"><h5>Sub 1.1</h5></a></li>
<li><a href="#"><h5>Sub 1.2</h5></a></li>
</ul>
</li>
<li><a href="#"><h3>Terzo</h3></a></li>
<li><a href="#"><h3>Quarto</h3></a></li>
</ul>
</nav>
</div>
</body>
</html>
e qui c'è la parte CSS:
*{padding:0px;
margin:0px;}
body{background-color:#FFFFFF;}
#master{width:800px;
height:1000px;
background-color:#F5F5F5;
margin:auto;}
nav{width:100%;
height:60px;
background-color:#EBEBEB;
float:left;}
ul#menu{list-style-type:none;
font-family:Courier;}
ul#menu li{float:left;
text-align:center;
width:160px;
background-color:#FFCC00;
border-radius:10px 10px 10px 10px;
margin-top:15px;
margin-left:30px;
position:relative;}
ul#menu li a{text-decoration:none;
color:black;
font-weight:bold;}
ul#menu li.active, ul#menu li:hover {background-color:#4DB849;}
ul#menu li.active, ul#menu a:hover {color:#FFCC00;}
ul#menu, ul.submenu{list-style-type:none;}
ul#menu ul.submenu{display:none;
position:absolute;}
ul.submenu li{width:160px;
height:22px;
line-height:22px;}
ul#menu li:hover .submenu{display:block;}
Rispondi quotando
