Align Blog to Left.

Monday, May 19, 2008 | with 0 comments »
Add to Technorati Favorites

You can push your whole blog body to the left in two steps.........

First backup your template. Go to edit Html subtab of Template tab and click on Download Full Template link. Save the XML file to your PC with an appropriate name.
Next scroll down in Edit Template text box till you come to :

Content
----------------------------------------------- */
#outer-wrapper {
padding-left: 200px;
padding-right: 190px;
text-align: left;
xxxxxxxxxxxxxxxxxxxx
border-top: 0;
overflow: hidden;
}

This is also named as outer-wrapper on some templates. This contains the whole blog and if you add following lines of code to it the whole blog will shift to left leaving you plenty of space in the body at the right to add an extra column or two.
These lines are added at xxxxxxx position above :

float:left;
margin-left:20px;

If there is already a line for margin property delete it and add above line. This will prevent blog from getting too close to the screen edge.
To utilize the extra space in the right you can add a column like this :

#rightcolumn {
float:right;
margin-right:20px;
}

and place it just under the tag in the template like this :




Preview and Save Template.
Advantages of this is to use more of the screen and also better visibility at low screen resolutions.

Add to My AOL Add to Google Reader or Homepage Add to netomat Hub I heart FeedBurner Subscribe in NewsGator Online Subscribe in a reader

0 comments