Ho questa lista, che si tramuta in un menu orizzontale a tendina trascrivo il codice html:
</head>
<body>
<div class="menu">
<ul id="menu2livelli">
<li class="primo">home
<li class="primo">mission
<li class="primo">progetti
<ul> [*]urbanistica
[*]edifici
[*]interni
[*]impianti
[/list]
<li class="primo">lo studio
<ul>
[*]il capoccia
[*]lo staff
[*]free lance
[*]impianti
[/list]
<li class="primo">contatti
[/list]
</div>
</body>
</html>
ora riporto il css:
<style type="text/css">
div.menu{
width: 511px;
height: 28px;
position:absolute;
margin-left:445px;
margin-top: 35px;
font: Arial, Helvetica, sans-serif;
z-index: 1500;
}
ul#menu2livelli{
float: left;
margin: 0;
padding: 0;
list-style: none;
line-height: 100%;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
color: #000000;
}
ul#menu2livelli li ul li{
float:left;
list-style: none;
margin: 0;
padding-top: 5px;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
font-style: normal;
color: #000000;
}
ul#menu2livelli li {
float: left;
margin: 0;
padding: 0;
width: 95px;
height: 20px;
font-size: 14px;
}
ul#menu2livelli a:link,
ul#menu2livelli a:visited{
display: block;
padding: 2px 2px;
text-decoration: none;
color: #7f8c9c;
}
ul#menu2livelli a:hover,
ul#menu2livelli a:focus
ul#menu2livelli a:active{
color: #ff0000;
text-decoration: none;
}
ul#menu2livelli li ul {
display: none;
}
ul#menu2livelli li:hover ul {
display:block;
position: absolute;
z-index: 1;
width: 100px;
padding: 0;
margin: 0 0 0 -1px;
font-size: 14px;
}
ul#menu2livelli li li{
width: 80px;
border-bottom:1px solid #B2B2B2;
}
per ultimo ho aggiunto il richiamo child a primo,
.primo{
color: #000000;
}
</style>
non succede nulla cioè il titolo dei menù non viene differenziato dalle voci di sotto menu, sbaglio qualcosa oppure qualche blocco di codice entra in conflitto?
Un saluto da fabio

Rispondi quotando