Spacing issues

Hello, I'm working on this page and I can't figure out why there is such a huge empty space above and below the image/text when I view this page for ipad pro in the developer tools on chrome. I've looked through the sections and wraps and don't see anything obvious that is setting any extra padding or margins... Can you help me discover where the space is coming frrom?

Here's a screen shot of what I'm seeing: https://snipboard.io/zZoYlI.jpg

Thanks!

Comments

  • Hello,
    You are using the "Equal Height of Wraps" + "Full Screen" in section settings and while resizing it's keeping the original height while loading.
    Do not worry about it, it will look fine on devices on load, because it's attaching this height value while the page is loaded.
    Thanks
  • Thanks. I am now having other spacing issues that I don't understand on this page. When I view the page in developer mode, I'm seeing that padding is set to 328px on the top and bottom of the "What We Treat / How We Treat" section, but I can't figure out where that setting is to change it?
  • It is because you are using the "Full Screen" option in the section with that element.
    Please edit the section with this element and tick off that option:

    Thanks
  • OK... but that is not checked on this page and I'm still getting that weird spacing on ipad. What can I do differently?

    Question #2: I'm also getting weird spacing now on desktop view as well. See this screen shot... I set the padding at the top to 0, but still there is so much space between the nav bar and the image.

    One more question...
    As you can see in this screen shot, I'm also trying to get the text section and the image section on this same page to align well. Right now, it appears that they are both vertically aligning to the top of their section. I set the section to align center, but they are still aligning to the top and I can't figure out why... 
  • 1,2)
    That's because of the section you inserted at the top of the mufifn builder:

    3) The equal height of wraps is used to position elements on: top, middle
    or bottom in wraps. In order to achieve this you need to:
    1. Edit your page, and go to the muffin builder. Edit a section and
    under the advanced>style select 'equal height of wraps'. See screens:
    http://prntscr.com/f40hvn
    http://prntscr.com/f40kh0
    2. Now edit each wrap in that section and set the desired vertical
    align(top, middle or bottom). See screens:
    http://prntscr.com/f40kvr
    http://prntscr.com/f40lhl

    Thanks
  • Ok, I think #1 and #2 questions have been answered. But I'm still struggling question #3.

    I set equal height wraps in the advanced section of the section.
    Then I set the vertical align to middle in the wrap section. But still they look like this....
    btw, I'm now working on this page, but it's the same format as the last one I sent you a question about.
  • That's because you inserted a single wrap: http://prntscr.com/re3nxx
    You have to use two wraps, one with image inside, second one with text (1/2 width of wraps), and then apply the "Equal height of WRAPS"
    Thanks
Sign In or Register to comment.
This website uses cookies

We use cookies to personalise content and ads, to provide social media features and to analyse our traffic. We also share information about your use of our site with our social media, advertising and analytics partners who may combine it with other information that you’ve provided to them or that they’ve collected from your use of their services.

Cookies are small text files that can be used by websites to make a user's experience more efficient.

The law states that we can store cookies on your device if they are strictly necessary for the operation of this site. For all other types of cookies we need your permission. This means that cookies which are categorized as necessary, are processed based on GDPR Art. 6 (1) (f). All other cookies, meaning those from the categories preferences and marketing, are processed based on GDPR Art. 6 (1) (a) GDPR.

This site uses different types of cookies. Some cookies are placed by third party services that appear on our pages.

You can at any time change or withdraw your consent from the Cookie Declaration on our website.

Learn more about who we are, how you can contact us and how we process personal data in our Privacy Policy.

Please state your consent ID and date when you contact us regarding your consent.