Ho realizzato un menų orizzontale con rollover con i css ma non riesco a centrarlo nella pagina....
Vi posto il codice di tutto il file. Il menų risulta allineato a sinistra mentre io lo vorrei centrato...
Se riuscite a risolvere il problema mi fate un favorone! Grazie!
codice:
<!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>
<style type="text/css">
body {
margin:0;
padding:0;
font: bold 11px/1.5em Verdana;
background: url(background.gif) repeat;
text-align: center;
}
h2 {
font: bold 14px Verdana, Arial, Helvetica, sans-serif;
color: #000;
margin: 0px;
padding: 0px 0px 0px 15px;
}
img {
border: 0 px;
}
div#pag {
width: 75%;
height: 600px;
background: #E6FFBF;
margin: 0px auto; /* allineamento centrale, per FF */
text-align: left; /* riporta il testo a sinistra, per IE */
border: 1px solid #000;
}
/* Menu Tabs */
div#menu-tabs {
float:left;
width:85%;
background:#E6FFBF;
font-size:93%;
line-height:normal;
border-bottom: 1px solid #CCC;
}
div#menu-tabs ul {
margin:0;
padding:10px 10px 0 50px;
list-style:none;
}
div#menu-tabs li {
display:inline;
margin:0;
padding:0;
}
div#menu-tabs a {
float:left;
background:url(SINISTRABORDO.gif) no-repeat left top;
margin:0;
padding:0 0 0 4px;
text-decoration:none;
border: 0px;
}
div#menu-tabs a span {
float:left;
display:block;
background:url(DESTRABORDO.gif) no-repeat right top;
padding:5px 15px 4px 6px;
color:#838383;
}
/* Commented Backslash Hack hides rule from IE5-Mac \*/
div#menu-tabs a span { float:none; }
/* End IE5-Mac hack */
div#menu-tabs a:hover span { color:#434343 }
div#menu-tabs a:hover { background-position:0% -42px; }
div#menu-tabs a:hover span { background-position:100% -42px; }
</style>
</head>
<body>
<div id="pag">
<h2>Tab Menu</h2>
<div id="menu-tabs">
<ul>
[*]<span>HomePage</span>
[*]<span>News</span>
[*]<span>Download</span>
[*]<span>Report PPV</span>
[*]<span>Forum</span>
[*]<span>Account</span>
[/list]
</div>
</div>
</body>
</html>