How To Reduce Spacing Between Widgets On Sidebar For Blogger Kher Cheng Guan| May 9, 2011

Here is a quick customizing tip on how to reduce the spacing between two widgets on the sidebar for Blogger.

Or how to shorten the distance between widgets on sidebar.

I do not know why many of the free Blogger templates come with wide spacing between one widget to the next widget or gadget on the sidebar.

I find it to be far too wide apart and it is a waste of spacing.  Furthermore, it doesn't look neat.

See the difference as shown in the picture below:

This is how you reduce spacing between two widgets or gadgets on the sidebar:

1. Go to your Dashboard.

2. Next click "Template". Then click "Customize".

3. Now go to "Advanced" and select "Add CSS" and enter this code: 

.widget {margin:8px 0;}

4. Now click "Apply to Blog" button.

You can reduce the value of 8px to even lesser value as to your liking.  I reduce it to zero for my own blog here.

Note: there is a dot in front of the word widget. 

If this method does not work for your template, here is another way  how to reduce the spacing between two widgets or gadgets on the sidebar of Blogger.

1. Go to Dashboard and click "Template".

2. Next click "Edit HTML". Tick "Expand Widget Templates".

3. See if you have this code or something similar:

.sidebar .widget, .main .widget {
margin:0 0 1.5em;
padding:0 0 1.5em;
}

4. Now the padding digits. 1 and 5 change them to 0 (zero)

5. Click "SAVE TEMPLATE".

CAUTION: Always backup your Blogger template before you make any changes to it.

* Here is the tip on how to reduce the spacing between widgets on sidebar of Cutline Theme.