Premetto che non utilizzo molto i CSS.
In una pagina ridefinisco i tag ul per creare un menu dinamico:
ul{
margin: 0;
padding: 0;
list-style: none;
width: 25px; /* Width of Menu Items */
}
ul li{
position: relative;
}
li ul{
position: absolute;
left: -100px; /* Set 1px less than menu width */
top: 17px;
width:125px;
display: none;
border-bottom: 1px solid #ccc;
}
/* Styles for Menu Items */
ul li a{
font-size:9px;
letter-spacing: 1px;
font-variant: normal;
font-style: normal;
font-weight: bold;
display: block;
text-decoration: none;
color: #777;
background: #fff; /* IE6 Bug */
}
/* Fix IE. Hide from IE Mac \*/
* html ul li { float: left; height: 1%; }
* html ul li a { height: 1%; }
/* End */
ul li a:hover { color: #E2144A; background: #f9f9f9; } /* Hover Styles */
li ul li a { padding: 2px 5px; border-left: 1px solid #ccc;border-right: 1px solid #ccc;border-top: 1px solid #ccc;} /* Sub Menu Styles */
li:hover ul, li.over ul {
display: block;
} /* The magic */
Adesso però ho un problema: come faccio all'interno della stessa pagina ad utilizzare i normali tag ul senza applicare lo stile css che li modifica?
Grazie e ciao a tutti....
Rispondi quotando
