Изтеглих си готово меню (хоризонтално) , понеже не ми се играеше да си правя. Когато го сложих, бутоните се извеждаха от лявата страна на страницата. Когато промених style.css, навсякъде където имаше:
[css]float:left;[/css]
го промених на
[css]float:center;[/css]
обаче менюто се обърка. Ето за какво става на въпрос:
След промяната на CSS файла:
Ето 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 кодът:
[css]float:left;[/css]
го промених на
[css]float:center;[/css]
обаче менюто се обърка. Ето за какво става на въпрос:

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

Ето 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>