myGully.com - CSS Navigation problem

Hi

ich hab mir heute mal ein tut angeschaut für mouseover navigation mit css
alles hat wunderbar funktioniert außer das die buttons alle zusammen hängen also kein platzt dazwischen

verstehe nicht warum vllt kann mir ja wer helfen :)

hier der teil aus der html datei

PHP-Code:


		
			
<div class="navbar">

<div class="act"><a href="#">HOME</a></div>

<div class="button"><a href="#">RAIDPLANER</a></div>

<div class="button"><a href="#">FORUM</a></div>

<div class="button"><a href="#">MITGLIEDER</a></div>

<div class="button"><a href="#">ERFOLGE</a></div>

<div class="button"><a href="#">BEWERBEN</a></div>

</div>

und die css datei

PHP-Code:


		
			
.navbar{

    width: 575;

    height: 37;

    font-family: Verdana;

    font-size: 14px;

    line-height: 35px;

    font-weight: bold;

    background: url(navbar_grad.jpg) repeat-x;

}

.button a{

    float: left;

    height: 37px;

    color: #fff;

    text-decoration: none;

    text-align: center;

    }

.button a:hover{

    float: left;

    height: 37px;

    color: #ffa200;

    text-decoration: none;

    text-align: center;

    background: url(navbar_grad_roll.jpg) repeat-x;

    }

.act a{

    float: left;

    height: 37px;

    color: #ffa200;

    text-decoration: none;

    text-align: center;

    background: url(navbar_grad_roll.jpg) repeat-x;

    }

.act a:hover{

    float: left;

    height: 37px;

    color: #ffa200;

    text-decoration: none;

    text-align: center;

    background: url(navbar_grad_roll.jpg) repeat-x;

    }