This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

Too much white space between rows in page builder

Resolved 27 replies premiumthemetheme-vantage
Rachel Bolton
11 years ago · Last reply by Gareth Archer 9 years ago

There is a big gap of white space between the rows on my homepage, built with Page Builder, at www.grandriversoap.com.

I’ve gone to Settings>Page Builder and set the Row Bottom Margin from 30 all the way down to 0. That didn’t change anything. I’ve also gone into ‘edit row’ in Page Builder and under ‘Theme’ selected No Bottom Margin for both of the rows in the page.

Any suggestions on how to shorten the white space?

Thank you!

URL: http://www.grandriversoap.com

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

27
  1. Dirk van de Mortel 11 years, 12 days ago

    Hiya,

    I took on your page. With the console (Chrome or Firefox) you can inspect the html elements. I found:

    media="all"
.layout-full .panel-row-style {
margin: 0 -1000px;
padding: 25px 1000px 25px 1000px;

    When you change the number 25 in 5 or something, in styles.css it will tighten the spacing between the rows. Test if that remains so, over the pages. There might be another class in styles.css that sets this space…. Inspect and you will find :)

  2. Andrew Misplon Staff 11 years, 12 days ago

    Hi rachelamanda

    Thanks for reaching out. We’re in a bit of a flux phase where we have new Page Builder options under Edit Row > Layout and Edit Row > Theme. This is currently some cross over (legacy issues) which we’ll resolve in the next update. Bottom Margin is working, I can see that in your source, the row bottom margin is set to zero. There is however, as Dirk mentioned, still row padding. Ideally you should be able to go to the Layout tab and set Padding to zero, that’s currently not working in Vantage, so here is what you can do:

    1. Edit the row, click Attributes tab on the right.
    2. Enter a row class name in, something like:

    no-bottom-padding

    3. Then under Appearance > Custom CSS let’s target that class. Insert the following:

    .no-bottom-padding {
padding-bottom: 0;
}
  3. Rachel Bolton 11 years, 11 days ago

    I think I followed your instructions properly. But, it didn’t create any change.

  4. Andrew Misplon Staff 11 years, 11 days ago

    Ahh right. Ok nearly there, let’s change Appearance > Custom CSS to be more specific:

    .layout-full .panel-row-style.no-bottom-padding {
padding-bottom: 0;
}
  5. Rachel Bolton 11 years, 7 days ago

    Thanks Andrew. That definitely tightened up the space between the rows within the content. So, we’re almost there now.

    It didn’t affect the big space between the page title (Natural and Organic Soaps and Skincare) and the sub-title (Handmade with Love in Brantford, ON) (which is the first row in the Page Builder layout, using a Visual Editor widget).

    Is there something else that needs to be applied specifically here?

  6. Andrew Misplon Staff 11 years, 6 days ago

    Try swapping out this one selector in your Custom CSS and edit as required:

    layout-full .panel-row-style.no-bottom-padding {
margin-top: -15px;
padding-top: 0;
padding-bottom: 0;
}
  7. Andrew Misplon Staff 11 years, 6 days ago

    Hope that helps.

  8. Rachel Bolton 10 years, 8 months ago

    So, I really dropped the ball on resolving this issue. But have come back to it today. I’ve updated the CSS as suggested and tried making all of the different numbers smaller. It doesn’t make any changes to the whitespace between the rows. Any other suggestions?

  9. Andrew Misplon Staff 10 years, 8 months ago

    Hi Rachelamanda

    Would it be possible for you to create a temporary admin account for us so we can log in and take a look?

  10. Rachel Bolton 10 years, 8 months ago

    Thanks Andrew. I’ve just created the user and you should receive the email confirmation shortly.

  11. WordPress Private 10 years, 8 months ago

    This is a private message.

  12. Andrew Misplon Staff 10 years, 8 months ago

    Thanks. Take a look now. I’ve added a style to the bottom of your Custom CSS and added that same row style to the second row of your home page under Attributes.

    Take a look and let me know if you need us to explain any further.

  13. Rachel Bolton 10 years, 8 months ago

    Hi Andrew,

    Maybe it is the way the site is displaying on my computer? I still don’t see any difference :-(

    I’ve posted a screenshot at http://www.grandriversoap.com/wp-content/uploads/2015/06/white-gaps.png and added arrows to indicate the spaces that I’d like to be able to shrink. Is this the way they display for you too?

    Thanks,
    Rachel

  14. Andrew Misplon Staff 10 years, 8 months ago

    No problem. Please check your home page and Custom CSS now. I’ve removed heading padding and added our no-padding class to both rows. You can now make adjustments from this point.

  15. Rachel Bolton 10 years, 8 months ago

    Thank you! This was perfect.

  16. Andrew Misplon Staff 10 years, 8 months ago

    For sure, glad we could help :)

  17. Ahmed Kassim 10 years, 1 month ago

    Hi

    Please help me get rid of this white space between my menu header and page builder row.

    I have read similar threads and i have tried the following code in Custom CSS which only reduces the space by I think about half

    #main {
    padding-top: 0;
    }

    #main {
    padding: 0px;
    }

    both these codes only reduce the white space by half.
    any suggestions?

    thnx

  18. IMTanuki 10 years, 16 days ago

    HI

    I am having a similar issue.

    WP Version: 4.4.1
    Theme: Elegant Theme / The Professional
    Web Site: http://www.easternwind.asia

    I am in the process of cutting over to Artbees Jupiter, but in the meantime…

    PROBLEM
    I have both of the following scenarios:

    1) Multiple rows, each with one Site Origin Editor widget.

    2) 1 row, with multiple Site Origin Editor widgets.

    In BOTH cases:

    a) Too much space between widgets.

    b) A bottom border under each widget.

    TROUBLESHOOTING
    I have tried all of your recommendations above, but nothing seems to make a difference…

    Thanks in advance for any help you can provide!

  19. Lucas Tolle 10 years, 16 days ago

    Hello, Ahmed Kassime and IMTanuki

    The problem seems to be the same, it is different than the first user informed.

    In addition, this topic has already been closed. Please open a new topic, including the website link or page where there is the problem that we will be happy to help them.

  20. WordPress Private 10 years, 5 days ago

    This is a private message.

  21. alis veronica sulbaran mora Private 10 years, 5 days ago

    This is a private message.

  22. Kelly Waters Private 9 years, 9 months ago

    This is a private message.

  23. WordPress Private 9 years, 9 months ago

    This is a private message.

  24. Monkeyye 9 years, 4 months ago

    The only way so solve this is that never put more than one widge in the same line.
    Then you can set every padding and margin.
    The space between two lines can be set as 0;

    Hope this can help.

  25. Thomasj 9 years, 2 months ago

    Hello all,

    I have a similar problem just at the bottom of the row, I followed the instructions Andrew supplied and managed to rid the top padding but it did not fix the white space at the bottom, I tried adding similar code to other attributes around my site with no success. I really appreciate any help in advanced..

    Thank you.

    Thomas.

  26. Thomasj 9 years, 2 months ago

    Update: I managed to fix this by adding -80px to the bottom margin in the Row styles..

    Thanks for the fix Andrew..

  27. Gareth Archer 9 years, 2 months ago

    Just as a note to anyone struggling with this still. I went Settings > Page Builder > Layout > Row Bottom Margin > -50px > Save

    Thanks for creating such an awesome plugin

Replies on this thread are closed.

Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Have a different question or issue?

Start New Thread