Changing alignment of Pages Tab for Blogspot blogs

I have been using Blogspot's Template Designer for my blogs and have been great so far.  But while the GUI interface will enable you to get almost all things done, there are things that require you to go to the back-end and tweak it up a bit.  The good news is that Template Designer allows for additional coding to change the CSS on which the design is interpreted.

In my case, I created a banner for my blog gofilipino.net.  I'm using the horizontal pages tab in this case.  When I uploaded my banner, I realized that the top left section has become too crowded, what with the graphic banner and the horizontal pages tabs in the same area. So I decided to align the Pages tab to the right.

A quick look at Template Designer revealed that it's not a simple click-a-button fix.  So I Googled for an answer and arrived at Blogger Sentral.  The fix suggested worked!  And it's easy-peasy.

In my case, I needed to go to Dashboard - Design - Template Designer - Advanced - Add CSS.

And then I added the following code in the space provided for:

.PageList {text-align:right !important;}
.PageList li {display:inline !important; float:none !important;}

The preview pane instantaneously showed me what the change would look like.  I clicked "Apply to Blog" and presto, a right-aligned Pages tab.

If you need to have your Pages tab centered, or if it's vertically laid-out, you need to head over to Blogger Sentral and see what fix is needed for your case.

Thank you Blogger Sentral!