rosemckay,
Yes, CSS is extremely confusing! It’s one of those things that, the more you play with it, the easier it gets. I’ll do my best to answer your question.
#navigation li {
float:left;
That tells the browser to override the normal behavior of an <li> tag and automatically “float” everything to the left.
I never really say that one type of code is better than another, because it’s usually just style. However, I’ll show you what my usual CSS is for this task, and maybe it’s easier to read:
#nav li {
list-style-type: none;
display: inline;
}
Here above, all we’ve done is set the <li> tag to “list-style-type: none” which basically just gets rid of the bullet points. Then, “display: inline” makes the <li> tags stack right next to each other (horizontally), where as this tag has a default “display” value of “block”, which causes each one to be on a different line.
I’m not the best at explaining things, but I hope that helps. Please let me know if I can help you further.
