Sidebar Revamp

After exchanging a few design words with Mike Rundle, jet-setter and 9rules designer extraordinaire, I've spent most of the evening tweaking my sidebar. Since the recent realignment, I had always felt uneasy about the composure and structure of the sidebar area. Mike assured me that text-align:right; was not working. In addition to aligning text to the left, I split up the main menu into 2 columns and created a graphic from a picture (currently, the same one on my about page).

If you want to put any list on your site into columns, take a look at the basic CSS below.

.your-div li {
    float: left;
    width: 50%;
}
.your-div ul {
    height: auto;
    overflow: auto;
    width: 210px; /*in this case each column will be 210px * the width above (50%) = 105px*/
}

The height and overflow attributes for the unordered list are rather important and ensure that everything clears properly, as each list item is a floated element. Without these, things below your columns would try to sneak up and overlap.