Support » Themes and Templates » Extra space between Front Page widgets

  • mn8101xb


    I am new, slowly learning wordpress and having some trouble with margins/padding.
    Using Twentytwelve child theme

    1) I just added two widgets in the Front page Widget area. One in the first, one in the second area. However now there is a large gap between the two. I assume this is a margin or padding error, but I can’t find what piece to edit.

    2) Also, there is a large portion of white space below these front page widgets. Margins and padding again?

    3) Can anyone recommend a good website to learn the basics of margins/padding specifically?

    The Site:

    Any solutions?
    Thank you in advance.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Kevin Marsden


    It’s all margin and padding. There are a lot of sites with tutorials, but your best bet is to use your browser’s developer tools to inspect the webpage and make test changes. I recommend using Chrome Developer Tools or Firebug for Firefox. They make it very easy to see the CSS selectors and properties.

    Let me know if you have any questions.

    Kevin Marsden


    Also, for the space between the widgets, look at the width property.

    Here are the width selectors for the widgets:

    .template-front-page.two-sidebars .widget-area .front-widgets + .front-widgets {
    width: 39.0625%;
    .template-front-page .widget-area .widget, .template-front-page.two-sidebars .widget-area .front-widgets {
    width: 51.875%;

    If you increase the width of these two areas, they’ll take up more of the available space and there will be less white space between them.

    And if you’re not doing so already, make any CSS changes in a child theme or the Jetpack CSS module.

    Let me know if you have any questions.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Extra space between Front Page widgets’ is closed to new replies.