Проблем с центрирането на бутоните в меню

xanoc

Registered
Изтеглих си готово меню (хоризонтално) , понеже не ми се играеше да си правя. Когато го сложих, бутоните се извеждаха от лявата страна на страницата. Когато промених style.css, навсякъде където имаше:
[css]float:left;[/css]
го промених на
[css]float:center;[/css]
обаче менюто се обърка. Ето за какво става на въпрос:
4390768l.png

След промяната на CSS файла:
4390755n.png

Ето CSS файлът:
[css]ul#menu
{
margin:0;
padding:0;
list-style-type:none;
width:auto;
position:relative;
display:block;
height:30px;
font-size:12px;
font-weight:bold;
background:transparent url(images/nav_bg.png) repeat-x top left;
font-family:Arial, Helvetica, sans-serif;
border-bottom:1px solid #000000;
border-top:1px solid #000000;
}

ul#menu li
{
display:block;
float:left;
margin:0;
padding:0;
}

ul#menu li a
{
display:block;
float:left;
color:#999999;
text-decoration:none;
font-weight:bold;
padding:8px 20px 0 20px;
}

ul#menu li a:hover
{
color:#FFFFFF;
height:22px;
background:transparent url(images/nav_bg.png) 0px -30px no-repeat;
}


ul#menu li a.current
{
display:inline;
height:22px;
background:transparent url(images/nav_bg.png) 0px -30px no-repeat;
float:left;
margin:0;
}


body {
background-image:url('images/bg.jpg');
}
[/css]
Ето и HTML кодът:
HTML:
		<div>
			<ul id='menu'>
			<li class="button"><a href='index.php' >Начало</a></li>
			<li class="button"><a href='forum/'  >Форум</a></li>
			<li class="button"><a href='team.php'  >Екип</a></li>
			<li class="button"><a href='lsgl/'  >Сървъри</a></li>
			<li class="button"><a href='banners.php'  >Банери</a></li>
			</ul>
		</div>
 

vardana

Registered
Пробвай така
HTML:
               <div><center>
                        <ul id='menu'>
                        <li class="button"><a href='index.php' >Начало</a></li>
                        <li class="button"><a href='forum/'  >Форум</a></li>
                        <li class="button"><a href='team.php'  >Екип</a></li>
                        <li class="button"><a href='lsgl/'  >Сървъри</a></li>
                        <li class="button"><a href='banners.php'  >Банери</a></li>
                        </ul></center>
                </div>
 

god_of_cs

Registered
float: center; няма. Не слушай горният коментар, това е най- голямата простотия - <center> и </center>... Направи text-align: center; в css на менюто.
 

speedley

Registered
HTML:
<html>
<head>
<style type="text/css"/>
#menu
{
        margin:0;
        padding:0;
        list-style-type:none;
        width:auto;
        position:relative;
        display:block;
        height:30px;
        font-size:12px;
        font-weight:bold;
        background:transparent url(images/nav_bg.png) repeat-x top left;
        font-family:Arial, Helvetica, sans-serif;
        border-bottom:1px solid #000000;
        border-top:1px solid #000000;
}

#menu li
{
        display:block;
        float:left;
        margin:0;
        padding:0;
}
        
#menu li a
{
        display:block;
		float: ;
        color:#999999;
        text-decoration:none;
        font-weight:bold;
        padding:0px 20px 0 20px;
}
        
#menu li a:hover
{       
        color:#FFFFFF;
        height:22px;
        background:transparent url(images/nav_bg.png) 0px -30px no-repeat;              
}
        

#menu li a.current
{
        display:inline;
        height:22px;
        background:transparent url(images/nav_bg.png) 0px -30px no-repeat;      
        float:left;
        margin:0;
}


body {
background-image:url('images/bg.jpg');
} 
#button1
 {
 padding: 0px 20px 0 400px;
 }
</style>
</head>
<body>
      <div id="menu"/>
						<ul>
                      <div id="button1"/>  <li class="button"><a href='index.php' >Начало</a></li></div>
                        <li class="button"><a href='forum/'  >Форум</a></li>
                        <li class="button"><a href='team.php'  >Екип</a></li>
                        <li class="button"><a href='lsgl/'  >Сървъри</a></li>
                        <li class="button"><a href='banners.php'  >Банери</a></li>
                        </ul>
                </div>
				</body>
				</html>
Ето до какво решение стигнах, може да не е много добро, но поне е центрирано :D :D
 

Горе