Feb 23, 2011

Styling a Link List in Blogger

When you first add a link list to your Blog, it tends to look something like this:


Yeah it's pretty ghetto. Let's fix it up by adding some custom CSS code to the template designer:

.LinkList li {display: block; float: right; margin: .2em 1em;}

Instead of telling the list items to show no bullets, I've just told them to show up as "block" elements, as if they were
s.

So now it looks like:


Better, of course, but the "find us" part needs to be next to the list. Here's how I'll accomplish that:

.LinkList h2 {float: left; text-align: left; margin-top: 0;}

And there we go: