On one of my newest projects, which can be found here, I wanted to take the sidebar and place it on the bottom, having the different items run horizontally. There would be four blocks along the bottom: About, Latest, Around the Web, and Blogroll. I don't know what the selector is that I am looking for or how I can make the list run horizontally.

What are the selectors and what are the values I need to make this guy hug the bottom?

Also, if you wanted the links inside to have block effects, you would need to do something like,

li { width: 25%; float: left; }
li a { display: block; }

Let's say you have a list like so:


<ul id="mylinks">
<li><a href="#">Link</a> </li>
<li><a href="#">Link</a> </li>
<li><a href="#">Link</a> </li>
<li><a href="#">Link</a> </li>
</ul>


In order for it to dispaly horizontally you need to apply the display: inline; rule to the <li>

like so:


ul#mylinks li {
display: inline;
}


This rule will select any <li> element inside #mylinks and float them next to each other(not sure if that's the right way to say it).

or you can use the wordspacing attribute just to space them out

Also visit http://css.maxdesign.com.au/index.htm I think this site is one of the best on this topic. There are a lot of examples!