Change Margins and Padding Of Blogger

MARGINS AND PADDING : Margins are space outside the element while padding is space inside the element. They are described in code as follows :

#header h1 {
margin:5px 5px 0 40px;
padding:55px 20px .25em;
}

They are described in this order : top, right, bottom and left in a clockwise fashion. When calculating the width of your blog add the widths of all the elements and the side margins to arrive at the correct figure. To change width of blog see How to Change Blog width. 


If only one value is specified then all have the same values. If value for left is missing then the value for right is used. If value for bottom is missing then value for top is used. If value for right is missing then value for top is used.

To center an element use :

#header h1 {
margin-left: auto;
margin-right: auto;
width:50%;
}

BORDERS surround the content and the padding and can be set using the following code (example):

#outer-wrapper {
border-style: solid; /*dotted,none,dashed,double,groove,ridge,inset,outset*/
border-width:4px;
border-color:#0000ff;
}

Other properties shown in second line in above code.

Posted in: CSS