Ho trovato su questo sito uno script css che genere un menu orizzontale che mi piace molto per l'effetto che genera. Unico problema è che rimane sempre allineato a sinistra e anche se ho provato a modificare qualche parametro, non riesco a centrarlo in orizzontale. Premetto che non ho mai programmato con i css sono un novizio.
Posto il codice hrml
e ora posto il codice csscodice:<!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">Home <li class="topmenu">Chi sono <li class="topmenu">Riconoscimenti <li class="topmenu">Verdura in intaglio <li class="topmenu">Partecipazioni <li class="toplast">Contatti[/list] </body> </html>
Ringrazio fin da ora chi mi saprà aiutare a risolvere il problemacodice: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;}
Rispondi quotando
