Benvenuto Ospite Cerca | Topic Attivi | Utenti | | Log In | Registra

Menu orizzontale con i css Opzioni
angelonardelli
Inviato: Sunday, March 20, 2011 4:02:58 PM
Rank: Newbie

Iscritto dal : 3/20/2011
Posts: 1
Buongiorno,
sono nuovo di questo forum e spero che questo sia lo spazio giusto per postare il mio problema.

Ho trovato su internet uno script css con annesso html che cenera un menu orizzontale che a me piace molto per l'effetto che crea. Unico problema rimane allineato a sinistra.
Pur provando a cambiare vari parametri non sono riuscito a centrarlo orizzontalmente.

inserisco il codice html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Logo</title>
<link rel="stylesheet" href="Style.css" type="text/css" />
</head>

<body style="background-color:#000000">
<ul id="cssmenu" class="topmenu">
<li class="topfirst"><a href="Home.html" target="secondo" title="Home">Home</a></li>
<li class="topmenu"><a href="Chi sono.html" target="secondo" title="Chi sono">Chi sono</a></li>
<li class="topmenu"><a href="Riconoscimenti.html" target="secondo" title="Riconoscimenti">Riconoscimenti</a></li>
<li class="topmenu"><a href="Verdura.html" target="secondo" title="Verdura in intaglio">Verdura in intaglio</a></li>
<li class="topmenu"><a href="Partecipazioni.html" target="secondo" title="Partecipazioni">Partecipazioni</a></li>
<li class="toplast"><a href="Contatti.html" target="secondo" title="Contatti">Contatti</a></li>
</ul>
</body>

</html>


e quello css

ul#cssmenu,ul#cssmenu
ul{margin:0;
list-style:none;
padding:0;
background-color:#dedede;
border-width:1px;
border-style:solid;
border-color:#5f5f5f;
-moz-border-radius:0px;
-webkit-border-radius:0px;
border-radius:0px;}

ul#cssmenu
ul{display:none;
position:absolute;
left:0;
top:10%;
-moz-box-shadow:3.5px 3.5px 5px #000000;
-webkit-box-shadow:3.5px 3.5px 5px #000000;
box-shadow:3.5px 3.5px 5px #000000;
padding:0 10px 10px;
background-color:#FFFFFF;
border-radius:0px;
-moz-border-radius:0px;
-webkit-border-radius:0px;
border-color:#d4d4d4;}

ul#cssmenu
li:hover>*{display:block;}

ul#cssmenu
li:hover{position:relative;}

ul#cssmenu
ul ul{position:absolute;
left:100%;
top:0;}

ul#cssmenu
{display:block;
font-size:0;
float:left;}

ul#cssmenu
li{display:block;
white-space:nowrap;
font-size:0;
float:left;}

ul#cssmenu>li,ul#cssmenu
li{margin:0;}

ul#cssmenu
a:active, ul#cssmenu a:focus{outline-style:none;}

ul#cssmenu
a{display:block;
vertical-align:middle;
text-align:left;
text-decoration:none;
font:bold 17px Verdana;
color:#ffff00;
text-shadow:#FFF 0 0 1px;
cursor:pointer;
padding:10px;
background-color:#aa007f;
background-image:url("mainbk.png");
background-repeat:repeat;
background-position:0 0;
border-width:0 0 0 1px;
border-style:solid;
border-color:#C0C0C0;}

ul#cssmenu
ul li{float:none;
margin:10px 0 0;}

ul#cssmenu
ul a{text-align:left;
padding:4px;
background-color:#FFFFFF;
background-image:none;
border-width:0;
border-radius:0px;
-moz-border-radius:0px;
-webkit-border-radius:0px;
font:14px Tahoma;
color:#000;
text-decoration:none;}

ul#cssmenu
li:hover>a{background-color:#f8ac00;
border-color:#C0C0C0;
border-style:solid;
font:bold 17px Verdana;
color:#000000;
text-decoration:none;
text-shadow:#FFF 0 0 1px;
background-image:url("mainbk.png");
background-position:0 100px;}

ul#cssmenu
img{border:none;
vertical-align:middle;
margin-right:10px;}

ul#cssmenu
img.over{display:none;}

ul#cssmenu
li:hover > a img.def{display:none;}

ul#cssmenu
li:hover > a img.over{display:inline;}

ul#cssmenu
span{display:block;
overflow:visible;
background-position:right center;
background-repeat:no-repeat;
padding-right:0px;}

ul#cssmenu
ul li:hover>a{background-color:#FFFFFF;
background-image:none;
font:14px Tahoma;
color:#868686;
text-decoration:none;}

ul#cssmenu
li.topfirst>a{height:5px;
line-height:5px;
border-radius:0px 0 0 0px;
-moz-border-radius:0px 0 0 0px;
-webkit-border-radius:0px;
-webkit-border-top-right-radius:0;
-webkit-border-bottom-right-radius:0;}

ul#cssmenu
li.topfirst:hover>a{line-height:5px;}

ul#cssmenu
li.topmenu>a{height:5px;
line-height:5px;}

ul#cssmenu
li.topmenu:hover>a{line-height:5px;}

ul#cssmenu
li.toplast>a{height:5px;
line-height:5px;
border-radius:0 0px 0px 0;
-moz-border-radius:0 0px 0px 0;
-webkit-border-radius:0;
-webkit-border-top-right-radius:0px;
-webkit-border-bottom-right-radius:0px;}

ul#cssmenu
li.toplast:hover>a{line-height:5px;}

nel css ci sono dei link a file png ce cossono anche non esserci per risolvere il problema.

Ringrazio anticipatamente chi mi saprà aiutare
Sponsor
Inviato: Sunday, March 20, 2011 4:02:58 PM

 
lui49
Inviato: Tuesday, March 29, 2011 7:27:47 PM
Rank: AiutAmico

Iscritto dal : 5/4/2003
Posts: 2,845
presumo tu abbia risolto.....
altrimenti prova a modificare nel primo id del css il valore "margin:0;" in "margin-left:200px;".....200px modificabile a piacere ovviamente.
Utenti presenti in questo topic
Guest


Salta al Forum
Aggiunta nuovi Topic disabilitata in questo forum.
Risposte disabilitate in questo forum.
Eliminazione tuoi Post disabilitata in questo forum.
Modifica dei tuoi post disabilitata in questo forum.
Creazione Sondaggi disabilitata in questo forum.
Voto ai sondaggi disabilitato in questo forum.

Main Forum RSS : RSS

Aiutamici Theme
Powered by Yet Another Forum.net versione 1.9.1.8 (NET v2.0) - 3/29/2008
Copyright © 2003-2008 Yet Another Forum.net. All rights reserved.