Centering float left



Centering float left typisch für die Menü-Website verwendet, wenn du deine Website-Menü float:left zentrieren möchte, du kannst dieses Skript verwenden

1. CSS

html,body{
margin:0;
padding:30px 10px;
text-align:center;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
}
#menu{
margin:auto;
text-align:left;
background-color:#EEE;
}

.main-menu{
float:right;
position:relative;
left:-50%;
text-align:left;
}
.main-menu ul{
list-style:none; 
position:relative;
left:50%;
margin:0;
padding:0;

.main-menu li{
float:left;
}

.main-menu li a{
display:block;
width:100px;
text-align:center;
float:left;
color:#777;
text-decoration:none;
padding:10px 15px;
}
.main-menu li a:hover{
background:#809900;
color:#fff;
}

.clear{
height:1px;
overflow:hidden;
margin-top:-1px;
clear:both;
}


2. Und hier die Menüs

<div id="menu">
 <div class="main-menu">
  <ul>
  <li><a href="#">Button 1</a></li>
  <li><a href="#">Button 2</a></li>
  <li><a href="#">Button 3</a></li>
  </ul>
 </div>
 <div class="clear">
 </div>
</div>

Viel Spaß
Official wiyono blog