Blogger Layout:Change width of any section

The structural blogger layout is as shown in above picture.This tutorial will teach you about how to change the width of these parts shown in the above pic which are the main parts of the template named header,footer,sidebar wrapper,main wrapper,outer wrapper.Now i know that some of you will find it difficult to change the width of these parts.The tutorial will teach you about changing the width in new blogger interface specially the new blogger's.

Modifying the Width of Blogger Layout Elements

Go to your blogger dashboard --> Template --> Edit Html ( tick the expand widget template option).

To Change width of Outer Wrapper

Find This Code:

body{background:#111 url(); width:980px; color:#333; font-size:12px; font-family:Arial,Tahoma,Verdana; margin:0 auto 0; padding:0}

#outer-wrapper{background:#111 url(); width:980px;color:#333; font-size:12px; font-family:Arial,Tahoma,Verdana; margin:0 auto 0; padding:0}

Change 980px to your Desired width!!

To Change Width Of Header:::

Find This Code:

#header{background:#000 url(); width:960px; height:155px; color:#fff; font-size:11px; margin:0; padding:0;overflow:hidden; margin-top:-4px;}

Change 960px to your desired value!!

To Change Width Of Sidebar Wrapper:::

Find This Code:

#sidebar-wrapper{float:right; width:320px;margin:0; padding:0 0 10px; display:inline}

Change 320px to your desired width and you are done!!

To Change Width Of Footer Wrapper:::

Find This Code:

#footer{width:660px; clear:both; margin:0 auto; padding-top:15px; line-height:1.6em; text-transform:uppercase; letter-spacing:.1em; text-align:center}

Change 660px to your desired length or value and you are done!!

HINT:-If you are unaware of finding particular code in your blogger template html.There is nothing to worry. Just press Ctrl and F buttons together and you will notice a search bar on your browser, enter the code to be searched in it and press enter.

Backup the Template before modifying!!

Important note: Always backup your blog's template before modifying it.To backup your template just go to your blogger dashboard --> Template, you will find the backup/restore option. Just click on it and download your template before doing modifications.