Newsgroup: it.comp.www.html
Titolo: CSS - menu orizzontale drop-down

Ho trovato questo menů orizzontale che sto personalizzando a piacimento.
http://www.cssplay.co.uk/menus/pro_drop3.html
Vorrei perň che i menů si aprissero verso l'alto e non verso il basso.
Cosa modificare?
Ecco il css:
.preload1 {background: url(drop3/blank_over.gif);}
.preload2 {background: url(drop3/blank_overa.gif);}
.menu2 {padding:0 0 0 32px; margin:0; list-style:none; height:36px; 
background:#fff; position:relative; z-index:500; font-family:arial, verdana, 
sans-serif;}
.menu2 li.top {display:block; float:left;}
.menu2 li a.top_link {display:block; float:left; height:36px; 
line-height:27px; color:#ccc; text-decoration:none; font-size:11px; 
font-weight:bold; padding:0 0 0 12px; cursor:pointer;background: 
url(drop3/blank.gif);}
.menu2 li a.top_link span {float:left; display:block; padding:0 24px 0 12px; 
height:36px;background:url(drop3/blank.gif) right top;}
.menu2 li a.top_link span.down {float:left; display:block; padding:0 24px 0 
12px; height:36px; background:url(drop3/blanka.gif) no-repeat right top;}
.menu2 li a.top_link:hover {color:#fff; background: 
url(drop3/blank_over.gif) no-repeat;}
.menu2 li a.top_link:hover span {background:url(drop3/blank_over.gif) 
no-repeat right top;}
.menu2 li a.top_link:hover span.down {background:url(drop3/blank_overa.gif) 
no-repeat right top;}
.menu2 li:hover > a.top_link {color:#fff; background: 
url(drop3/blank_over.gif) no-repeat;}
.menu2 li:hover > a.top_link span {background:url(drop3/blank_over.gif) 
no-repeat right top;}
.menu2 li:hover > a.top_link span.down 
{background:url(drop3/blank_overa.gif) no-repeat right top;}
.menu2 table {border-collapse:collapse; width:0; height:0; 
position:absolute; top:0; left:0;}
/* Default link styling */
/* Style the list OR link hover. Depends on which browser is used */
.menu2 a:hover {visibility:visible; position:relative; z-index:200;}
.menu2 li:hover {position:relative; z-index:200;}
/* keep the 'next' level invisible by placing it off screen. */
.menu2 ul,
.menu2 :hover ul ul,
.menu2 :hover ul :hover ul ul,
.menu2 :hover ul :hover ul :hover ul ul,
.menu2 :hover ul :hover ul :hover ul :hover ul ul {position:absolute; 
left:-9999px; top:-9999px; width:0; height:0; margin:0; padding:0; 
list-style:none;}
.menu2 :hover ul.sub {left:0; top:31px; background: #fff; padding:3px; 
border:1px solid #3a93d2; white-space:nowrap; width:90px; height:auto; 
z-index:300;}
.menu2 :hover ul.sub li {display:block; height:20px; position:relative; 
float:left; width:90px; font-weight:normal;}
.menu2 :hover ul.sub li a {display:block; font-size:11px; height:20px; 
width:90px; line-height:20px; text-indent:5px; color:#000; 
text-decoration:none;}
.menu2 :hover ul.sub li a.fly {background:#fff url(drop3/arrow.gif) 80px 7px 
no-repeat;}
.menu2 :hover ul.sub li a:hover {background:#3a93d2; color:#fff;}
.menu2 :hover ul.sub li a.fly:hover {background:#3a93d2 
url(drop3/arrow_over.gif) 80px 7px no-repeat; color:#fff;}
.menu2 :hover ul li:hover > a.fly {background:#3a93d2 
url(drop3/arrow_over.gif) 80px 7px no-repeat; color:#fff;}
.menu2 :hover ul :hover ul,
.menu2 :hover ul :hover ul :hover ul,
.menu2 :hover ul :hover ul :hover ul :hover ul,
.menu2 :hover ul :hover ul :hover ul :hover ul :hover ul
{left:90px; top:-4px; background: #fff; padding:3px; border:1px solid 
#3a93d2; white-space:nowrap; width:90px; z-index:400; height:auto;}
--
Newsgroup robomoderato - gli articoli vengono approvati automaticamente


-----cut---- 
prova cosě:
.menu2 : hover ul.sub {
left:0;
top:-100px;   /*questo ti imposta a che altezza appare il sottomenu rispetto 
al principale */
background: #fff;
padding:3px;
 border:1px solid #3a93d2;
white-space:nowrap;
width:90px;
height:auto;
 z-index:300;
}
Ciao
Izio 


Ci sono riuscito parzialmente, ma i sotto menů a tendina sono molto piů 
lunghi del normale.
ecco il risultato parziale
http://www.paesaggioitaliano.eu/prova/pro_drop3.html
All'interno dell HTML trovate il css. 


Ho risolto il problema del menu a tendina che vedete qui:
http://www.paesaggioitaliano.eu/prova/pro_drop3.html
Ora ho inserito questo menů a tendina orizzontale nel footer del mio sito
http://www.paesaggioitaliano.eu/fluido.php
ma cč un problema, mi appare sulla destra lo scroll verticale. Perchč?
poi non sono visibili le tendine del menů orizzontale
dovrebbe apparire cosě, senza lo scroll verticale.
http://www.paesaggioitaliano.eu/fluido2.php
Il css del layout della pagina č
http://www.paesaggioitaliano.eu/css/fluido.css
Il css del menů a tendina č qui:
http://www.paesaggioitaliano.eu/css/head_footer.css.css


Forse č meglio guardare a questo link
http://www.paesaggioitaliano.eu/fluido.html
Sulla destra mi appare una barra verticale che non dovrebbe apparire e le 
tendine del menů orizzontale in basso, non si vedono.
Come posso risolvere? 
