paskuale83
07-07-2010, 13:03
Salve a tutti, ho da poco iniziato a studiare i css però non riesco proprio a risolvere questo problema, ho scaricato un menù e questo è composto da html, css e javascript, quando lo inserisco nella mia pagina web si posiziona sempre sul lato sinistro della pagina mentre io vorrei posizionarlo al centro, vi posto il codice sperando possa essere utile:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>titolo</title>
<style type="text/css">
ul { list-style:none; margin:0; padding:0; }
li { float:left; width:100px; margin:0; padding:0; text-align:center; }
li a { display:block; padding:5px 10px; height:100%; color:#fff; text-decoration:none; border-right:1px solid #fff; }
li a { background:url(snook-animation-bg2.jpg) repeat 0 0; }
a:hover, a:focus, a:active { background-position:-150px 0; }
#a a { background:url(snook-animation-bg.jpg) repeat; background-position:-20px 35px; }
</style>
<script type="text/javascript" src="moo1.2.js"></script>
<script type="text/javascript">
window.addEvent('domready', function() {
/* example a: top down */
$$('#a a').each(function(el) {
//fx
var fx = new Fx.Tween(el,{
duration: 500,
link: 'cancel'
});
//css & events
el.setStyle('background-position','-20px 35px').addEvents({
'mouseenter': function(e) {
e.stop();
fx.start('background-position','-20px 94px');
},
'mouseleave': function(e) {
e.stop();
fx.start('background-position','-20px 35px');
}
});
});
});
</script>
</head>
<body>
<ul id="a">
<li><a href="pagina.htm">Home</a></li>
<li><a href="#"></a></li>
<li><a href="pagina.htm">Mediazione</a></li>
<li><a href="#"></a></li>
<li><a href="pagina.htm">Esami</a></li>
<li><a href="#"></a></li>
<li><a href="pagina.htm">Tesi</a></li>
</ul>
</body>
</html>
grazie a tutti
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>titolo</title>
<style type="text/css">
ul { list-style:none; margin:0; padding:0; }
li { float:left; width:100px; margin:0; padding:0; text-align:center; }
li a { display:block; padding:5px 10px; height:100%; color:#fff; text-decoration:none; border-right:1px solid #fff; }
li a { background:url(snook-animation-bg2.jpg) repeat 0 0; }
a:hover, a:focus, a:active { background-position:-150px 0; }
#a a { background:url(snook-animation-bg.jpg) repeat; background-position:-20px 35px; }
</style>
<script type="text/javascript" src="moo1.2.js"></script>
<script type="text/javascript">
window.addEvent('domready', function() {
/* example a: top down */
$$('#a a').each(function(el) {
//fx
var fx = new Fx.Tween(el,{
duration: 500,
link: 'cancel'
});
//css & events
el.setStyle('background-position','-20px 35px').addEvents({
'mouseenter': function(e) {
e.stop();
fx.start('background-position','-20px 94px');
},
'mouseleave': function(e) {
e.stop();
fx.start('background-position','-20px 35px');
}
});
});
});
</script>
</head>
<body>
<ul id="a">
<li><a href="pagina.htm">Home</a></li>
<li><a href="#"></a></li>
<li><a href="pagina.htm">Mediazione</a></li>
<li><a href="#"></a></li>
<li><a href="pagina.htm">Esami</a></li>
<li><a href="#"></a></li>
<li><a href="pagina.htm">Tesi</a></li>
</ul>
</body>
</html>
grazie a tutti