Quick CSS question

[Young]

My padding is affecting my hover background color in my lists. Where should I place the padding so that way the background color fills throughout?

What am I doing wrong?

#nav {
border: 1px solid #000000;
width:769px;
float:left;

}

#nav ul{
padding: 0;
margin:0;
float:left;
background-color: #FFFFFF;

}

#nav ul li{
display:block;
border: 3px solid #000000;
margin:0;
padding-right: 2px;
float:left
}

#nav ul li a{
color:#000000;
text-align:center;
text-decoration:none;
width: 9em;

}

#nav ul li a:hover{
background-color:#0099FF;
}

I realize my code maybe a little redundant but I don't go through and crunch everything till all is said and done.

any suggestions?

[Young]

also does someone wanna help me get rid of some of those "Floats"

All i'm trying to do is create a horizontal menu. Usually its a 2min job today for some reason its kicking my ass

[Young]

forget it...

im gonna go with classes

[kirupai]

#nav ul li{
display:block;
border: 3px solid #000000;
margin:0;
margin-right: 2px;
float:left
}

Try that

[Young]

#nav ul li{
display:block;
border: 3px solid #000000;
margin:0;
padding-right: 2px;
float:left
}

Try that

appreciate it kirupai. i'll keep that in mind for next time. I decided to go with a class instead.

[kirupai]

Try it again i forgot to change the padding to margin lol

[CyBå CüLt CRüE]

#nav ul li{
display:block;
border: 3px solid #000000;
margin:0;
margin-right: 2px;
float:left
}

Try that

That should work

[kirupai]

#nav ul li{
display:block;
border: 3px solid #000000;
margin: 0 2 0 0;
float:left
}

There you go even a little cleaner :P