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.
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.
Tweet This
Stumble This
{ 13 comments… read them below or add one }
I like the new look logo :)
More from author
I rather like the 2column idea, and seems quite innovative until all the agents support CSS3. When carefully used, columns will be very helpful.
Thanks for sharing the code!
More from author
I’m not so sure about the search box, I would either make the text stand out a bit more, or stick with the white background. Its kinda hard to see. I only noticed it because Glenn mentioned the logo
More from author
The search box seems rather difficult to locate. Like all the modifications to the sidebar except that one, as it is not intuitive at all.
More from author
Maybe if you just put some text, like “Search”, into the box it would be easier to see.
More from author
I agree wholeheartedly with Scott.
More from author
it seems everyone has the same thoughts on the search thing
More from author
Yeah, it’s very difficult to make out the text while it’s overlapping that photo. Otherwise it’s solid. x)
For the search box, I would have a semi-transparent white background in the box until someone types in that. That should give it just enough to make it stand out a little more.
More from author
yeah i was just playing around with search box backgrounds. Firefox is cool with them, but safari is not. So I had to pick a color they both can show but when the text area is focused have the colors change.
More from author
I liked the older design more. Seeing this latest design, I was confused and thought I had disabled images on my browser.
Anyways, your site loads a lot faster now :-)
More from author
Despite everyone’s issues with the logo, the site redesign is good and more accessible. It is eaasier to get straight to the content, which is, of course, most important. Bravo.
More from author
Oh, so you listen to Mike but not me? Understood :)
More from author