Title: Widget Spacing Help
Last modified: August 20, 2016

---

# Widget Spacing Help

 *  Resolved [EvolveDesigns](https://wordpress.org/support/users/evolvedesigns/)
 * (@evolvedesigns)
 * [13 years, 10 months ago](https://wordpress.org/support/topic/widget-spacing-help-1/)
 * I am creating a custom theme.
    I have a div with an id as “sidebar” in which 
   my widgets are contained. Right now I have a text widget, a custom social media
   plugin, and a search bar. I will be adding more, but for the time being, I’m 
   working on my formatting. As of right now, there is way too much space after 
   the widget title, before the widget content. How do I adjust this to make it 
   smaller?

Viewing 7 replies - 1 through 7 (of 7 total)

 *  [Michael](https://wordpress.org/support/users/alchymyth/)
 * (@alchymyth)
 * [13 years, 10 months ago](https://wordpress.org/support/topic/widget-spacing-help-1/#post-2881229)
 * > As of right now, there is way too much space after the widget title, before
   > the widget content. How do I adjust this to make it smaller?
 * adjust the margins or paddings in your style.css;
 * details, i.e. the css selectors, depend on the way you have registered the sidbars
   in functions.php;
    [http://codex.wordpress.org/Function_Reference/register_sidebar](http://codex.wordpress.org/Function_Reference/register_sidebar)
 * try and use a tool such as Firebug [http://getfirebug.com/](http://getfirebug.com/)
   to get more insight into those selectors.
 *  Thread Starter [EvolveDesigns](https://wordpress.org/support/users/evolvedesigns/)
 * (@evolvedesigns)
 * [13 years, 10 months ago](https://wordpress.org/support/topic/widget-spacing-help-1/#post-2881233)
 *     ```
       // Declare sidebar widget zone
           if (function_exists('register_sidebar')) {
           	register_sidebar(array(
           		'name' => 'Sidebar Widgets',
           		'id'   => 'sidebar-widgets',
           		'description'   => 'These are widgets for the sidebar.',
           		'before_widget' => '<div id="%1$s" class="widget %2$s">',
           		'after_widget'  => '</div>',
           		'before_title'  => '<h5>',
           		'after_title'   => '</h5>'
           	));
           }
       ```
   
 * that is my functions.php
 * i have tried these CSS codes with no success
    #sidebar { float:right; width:300px;
   margin: 0; padding: 0; }
 * #sidebar .widget-title {
    padding:0; }
 * .widget {padding: 0px;}
    .widget-content {margin-top: 5px;}
 * you can view the [site here](http://www.portwashingtonmama.com)
 * excuse the rest of the appearance, its a work in progress
 *  [Michael](https://wordpress.org/support/users/alchymyth/)
 * (@alchymyth)
 * [13 years, 10 months ago](https://wordpress.org/support/topic/widget-spacing-help-1/#post-2881244)
 * there is no `.widget-title` class with your widget titles, they are simply `h5`–
   as it is defined in here: `'before_title' => '<h5>',`
 * for these fundamental formatting problems, try using browser tools such as Firebug
   [http://getfirebug.com/](http://getfirebug.com/), or whatever your browser offers
   as inspection tool, to identify what influences the formatting of the elements.
 * if you want to continue customizing WordPress themes or any web applications,
   you will need to get familiar with css – [http://www.w3schools.com/css/](http://www.w3schools.com/css/)
 *  Thread Starter [EvolveDesigns](https://wordpress.org/support/users/evolvedesigns/)
 * (@evolvedesigns)
 * [13 years, 10 months ago](https://wordpress.org/support/topic/widget-spacing-help-1/#post-2881249)
 * i’m familiar with the css, its the php that is throwing me. I understand the 
   titles are styled with the h5, as it was originally an h2 from where I pulled
   the code, and I adjusted it, but even then, it was displaying a huge gap. I have
   also been using firebug, but it just shows a large space that seems to be connected
   with the h5, yet I can’t change it.
 *  Thread Starter [EvolveDesigns](https://wordpress.org/support/users/evolvedesigns/)
 * (@evolvedesigns)
 * [13 years, 10 months ago](https://wordpress.org/support/topic/widget-spacing-help-1/#post-2881255)
 * i fixed it with clear: both
 *  [Michael](https://wordpress.org/support/users/alchymyth/)
 * (@alchymyth)
 * [13 years, 10 months ago](https://wordpress.org/support/topic/widget-spacing-help-1/#post-2881256)
 * browsers are applying default styles to the html tags, including the h5 tag, 
   such as margins and padding, and font size, etc.
 * to reduce the gap, set the bottom margin of `#sidebar h5` to something small.
 * this is one of the reasons that some themes are using a ‘reset’ style section,
   to set all those defaults to zero, and then are adding formatting to the relevant
   elements.
 * nothing to do with php, and not a WordPress problem.
 *  Thread Starter [EvolveDesigns](https://wordpress.org/support/users/evolvedesigns/)
 * (@evolvedesigns)
 * [13 years, 10 months ago](https://wordpress.org/support/topic/widget-spacing-help-1/#post-2881257)
 * I do have the reset codes at the opening of my stylesheet

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘Widget Spacing Help’ is closed to new replies.

 * 7 replies
 * 2 participants
 * Last reply from: [EvolveDesigns](https://wordpress.org/support/users/evolvedesigns/)
 * Last activity: [13 years, 10 months ago](https://wordpress.org/support/topic/widget-spacing-help-1/#post-2881257)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics