How to Center Your Blog Template Design or start it from left,as you would have seen mostly all the blog designs are located at center,only few of the designs you will see starting from the left of your screen.That is the your blog design will either start from the left of the pc screen instead of showing at center or will show up in middle of screen expanding equally to left and right.This is now your choice on how to display your template,as below i am going to tell you about both methods.
As below i will be going to tell how to do it on basic default codes given by google in there template,as the code to your template may vary from user to user.But i will guide you for sure on how to find the codes if you want to change the alignment of your template.
Like just check the snapshots of design aligned to left and center.
The above blog design is aligned to left of the screen of your computer.Now lets just check the codes of it below.
Just find the below blogger codes in your blogger html.
#outer-wrapper {
margin:0;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}
Now in above code the property of margin is set 0.
If you will make it to set margin:0 auto;
Then the template design will align to center of your screen resolution,like below picture.
**Important Notes:- As the codes above i took was from google minima template.If you are using it you will do it easily.But if you are using templates by other designers you may not find codes with same name outer wrapper id.As they may have been defined differently,but the property you have to change is same as of margin in all designs.The skill you have to do is to find by which name the outer layout of your template has been defined.
In many designs you may find it with name #wrap or #wrapper or #outer-wrapper etc.
I hope you will be able to do it now,if you know little bit about template codes.
As below i will be going to tell how to do it on basic default codes given by google in there template,as the code to your template may vary from user to user.But i will guide you for sure on how to find the codes if you want to change the alignment of your template.
Like just check the snapshots of design aligned to left and center.
The above blog design is aligned to left of the screen of your computer.Now lets just check the codes of it below.
Just find the below blogger codes in your blogger html.
#outer-wrapper {
margin:0;
padding:10px;
text-align:$startSide;
font: $bodyfont;
}
Now in above code the property of margin is set 0.
If you will make it to set margin:0 auto;
Then the template design will align to center of your screen resolution,like below picture.
**Important Notes:- As the codes above i took was from google minima template.If you are using it you will do it easily.But if you are using templates by other designers you may not find codes with same name outer wrapper id.As they may have been defined differently,but the property you have to change is same as of margin in all designs.The skill you have to do is to find by which name the outer layout of your template has been defined.
In many designs you may find it with name #wrap or #wrapper or #outer-wrapper etc.
I hope you will be able to do it now,if you know little bit about template codes.
If you enjoyed this post, make sure you subscribe as an Reader!
Hi ! I am,Dan Alan,
0 comments:
Post a Comment