3 Blog Perfecting CSS Cheats

When I start working on a blog design, I have a list of things I'll do to give me a good base to go off of. Many of these are CSS edits to make a template look clean & sleek before I start adding to it.  But I usually forget these little tips & tricks each time because like a little do-dah, I haven't written them down!  This is where my blogging notebook comes in.  It's a bit primitive, using pen & paper to write down code, but if I don't I'll loose it in my documents, & lord knows I'll never print it!  So I thought I'd share with you today my 3 favorite CSS cheats to make your blog pretty & clean in no time.  The great thing about these little cheats is that you can paste them & go.  They will instantly pretty up your design!

 Center Tabs at Top 

Making a clean navigation bar at the top of your blog adds class & makes it seem like you know what you're doing.  I've always found that the alignment default by blogger was really ugly looking.  But simply adding the following CSS to your template will center them right nicely.

.PageList { text-align:center !important; }

 Remove Tabs Background 

Additionally, your tabs may have some crazy lines or colors around them.  If you can't get rid of all the formatting in the Template Designer, you can throw in this to get rid of the border, background, etc.

.PageList {text-align:center !important; border-bottom: none; border-top: none; border-color: none; background: none; }

 Center Header Text 

If you don't have fancy software or feel you aren't able to make a super great header with text & an image, the next best thing is to choose a font in the template designer (or use one from google webfonts, I'll post on that later!) & center the header text.  This gives your blog a streamlined look & you didn't really have to make any design decisions!  In fact, that's what I did with Five Sixteenths.  That's not an image up there, that's all edited & arranged through CSS!

.Header h1 { text-align: center; }

These 3 cheats make a great canvas to start from for a cool design.  I'd suggest starting from the Simple Template in blogger, but these should work for all the templates.  The Simple Template seems to be the easiest to customize in the Template Designer...pretty much it will do what you want it to :)

 What do you do now that you've got a great base design? 
Find some inspiration!

- Create a color palette using this tutorial that will make your blog reflect your style using colourlovers.  Use your Pinterest boards as color palette inspiration or browse a bunch of user made combos.

- Choose some fonts with the help of the font pairing guide here on 516 or research new pairings.

- Check out these two DIY Blog Designs here on 516 (here & here) but also look around at your favorite blogs to see what they're doing you might like.

 Resources for Inspiration 
Read some awesome tips over at Her New Leaf & follow her Primp My Blog series.
Check out Campfire Chic for more tips & tricks.
Pugly Pixel has a lot of CSS & Blogging Tutorials that are a little advanced (and just pretty things in general!).  Katrina also has a great CSS class or self guided option.

Connect on Twitter // Follow on Pinterest // Peep me at Hello Cotton