How to adjust post and widget margins in blogger

If you own a business, having a website or a blog is very important as it helps your business to reach many people in world thus grows your brand. The appearance of your website and how it is designed also matters a lot. If your website is well designed its easier to attract customers in your business. 

This post is going to show you on how to adjust margins for posts and widgets in a blogger blog as one of the ways of designing your blog and improve its appearance.

To adjust post margins in your blogger blog, you have to follow the steps below;

1. Open your browser then sign in to blogger.com and select a blog you want to edit.

2. On the blogger panel, Click on "theme".

3. Click on "Customise".

4. Click on "Advanced".

5. Click on "Add CSS".

6. Copy the CSS code below then paste it in the CSS box.

CSS code for adjusting Blogger Posts

.blog-posts  {margin-left:32px}

.blog-posts  {margin-right:32px}

Or use this code below

#Blog1  {margin-left:32px}

#Blog1  {margin-right:32px}

Adjusting blogger widget

To adjust the widget in blogger, you have to get an ID of the widget you want to adjust. To get widget ID is very simple, just do the following.

1. In the blogger panel, click layout then click edit icon on the gadget you want to adjust.

2. Look at the top of your browser where the URL is displayed, you will see the word "widgetId=" at the end of the URL. Just copy the word that follows after "widgetId=". The word which you copy is what we call widget id. For example from the image below the widget Id is "Navibar1".

3. Copy the code below and replace the word "widgetId" with your widget id.

#widgetId {margin-left:32px}

#widgetId {margin-right:32px}

For example, if the widget Id is "Navibar1" the CSS code will be,

#Navibar1 {margin-left:32px}

#Navibar1 {margin-right:32px}