Ciao, sto realezzando un menù orizzondale con i css; in pratica, oltre a visualizzare i nomi dei menù in modo orizzondale, ogni volta che vi si passa con il mouse sopra esce un sotto-menù anch'esso orizzondale. C'è però un problema: nel momento del passaggio del mouse, il sotto-menù esce però mi fa spostare verso sinistra il nome del menù a fianco.
Vi posto una parte del codice in modo che riuscirete a capire megio ciò che voglio dire.
Grazie a tutti
Ecco la parte di codice che mi da il problema:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento senza titolo</title>
</head>
<style>
#globalLink{
position: absolute;
top: 6px;
height: 22px;
min-width: 640px;
padding: 0px;
margin: 0px;
left: 10px;
z-index: 100;
}
a.glink, a.glink:visited{
font-size: small;
color: #000000;
font-weight: bold;
margin: 0px;
padding: 2px 5px 4px 5px;
border-right: 1px solid #8FB8BC;
}
a.glink:hover{
text-decoration: none;
}
#globalLink ul {
display:block;
margin: 0;
padding: 0;
list-style-type: none;
}
#globalLink li {
display: inline;
width:100%;
float:left;
margin: 0;
padding: 0;
}
#globalLink li ul {
overflow: hidden;
display:none;
margin: 0;
padding: 0;
list-style-type: none;
font-size:14px;
}
#globalLink li:hover ul {
overflow: hidden;
display:block;
padding: 6px 0px 0px 0px;
margin: 0;
list-style-type: none;
}
#globalLink li li {
overflow: hidden;
float:left;
display: inline;
width:100%;
padding: 3px 0px 0px 0px;
text-decoration:none;
}
#globalLink li li a {
overflow: hidden;
float:left;
display: inline;
padding: 1px 0px 0px 0px;
color:#000099;
text-decoration:none;
}
</style>
<body>
<ul id="globalLink">
[*]
global link
<ul>
[*]prova1 |
[*] prova1
[/list]
[*]
global link
<ul>
[*]prova1 |
[*] prova1
[/list]
[*]
global link
[/list]
</body>
</html>