Horizontally centering/evenly distributed inside of inside a

Question

Have a Navbar

, inside is a

and each
• contains a with a link (this is for a nav

Answer 1

you need to define a fixed width for your container .

for example:

.navbar {
width: 1000px; /* */
margin: 0 auto;
background-color: #ABCDEF; }

if you want to keep your bg color of .navbar, stick with 100%, remove float left from li and style it like this->

.navbar ul {
    list-style-type: none; /*to remove bullets*/
    text-align: center;
    margin: 0 auto;
    padding: 0px;
    width: 800px;
    overflow: hidden;
}
.navbar li{
    display: inline-block;
    padding: 2px;
    width: 150px;
    marign: 0 auto;
}