[Resolved] Align vertical spacing for different screen sizes (gb-inside-container padding)

[Stephan]

Good Day

I’m struggling to get the vertical spacing aligned between block elements.

Everything is fine on desktop (https://ibb.co/4m9pfqp), but the spacing gap becomes too large as the screen narrows.

For mobile I’ve had some success in compensating for the space by adding a custom css class to the top of the block and using:

@media (max-width: 1024px) {
    .minimize-top-on-mobile {
      margin-top: -170px;
    }
}

But even then the spacing is still a bit too large and if I decrease the margin even more the elements get cut off.
https://ibb.co/Z2ntWxZ

For medium sized screens the spacing is way off:
https://ibb.co/2SvrYsJ

How do I get the spacing consistent (like in the desktop size) across all screen sizes:
https://ibb.co/4m9pfqp

[David]

Hi there,

can you share a link to the site where i can see this issue ?

[Stephan]

Thank you – I’ve provided a link to the site in the private info box.

[Ying]

The grand parent container block of that H4 headline block has 160px padding top set for mobile:
https://www.screencast.com/t/3C3AQrI6c

You don’t need CSS, you just need to reduce or remove that top padding added to the container block.

[Stephan]

Ah perfect – thanks for spotting that.

[Ying]

No problem 🙂

[Author]

Posts