Why are the tops of my pages getting cut off?

Store Design
1

Hi there,

The tops of my shopify pages are getting cut off. It only happens on the pages shopify creates (login, collections) and not the ones I created with Gempages (landing pages, products, homepage). How do I fix this?

elevatedkarma.com

pw: chifri

Thanks for taking a look!

See social logins:

karmadesign_0-1637511565830.png
karmadesign_0-1637511565830.png659×533 12.8 KB

See header “Search Results” on mobile collection pages (https://elevatedkarma.com/pages/search-results-page?collection=mens-clothes :disappointed_face:

IMG_5037.jpg
IMG_5037.jpg828×1792 74 KB

2

@karmadesign

yes please add this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
@media only screen and (min-width: 750px) {
.main-content {
    padding-top: 175px;
}
}
3

Hi @KetanKumar —thanks for your suggestion!

This fixed the issue on my dsktop site, but I still have the issue on laptop, tablet and mobile. Any thoughts for these?

Logan

4
  1. Go to Online Store->Theme->Edit code
  2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
@media only screen and (min-width: 750px) {
.main-content {
    padding-top: 175px;
}
}


@media only screen and (max-width: 749px) { body:not(.gempage) .main-content { padding-top: 70px; } }

Hi @karmadesign we could add this CSS code above to fix the mobile screen side.

please try it and let us know if it works

1 Like
5

Thanks very much! This fixed all issues :slightly_smiling_face:

6

Hi @GemPages ,

This issue has resurfaced on my mobile pages, specifically the login page. Despite having the mobile code included.

Please take a look:

elevatedkarma.com

chifri

7

Hi @karmadesign

It’s GemPages team here to support you!

The code used is correct, but the closing curly brace is put in an incorrect position.

Incorrect position

Incorrect code.png
Incorrect code.png551×202 39.1 KB

We’ve moved it to the correct one

Correct code.png
Correct code.png603×219 58.1 KB

The issue is fixed now. Can you check on your end if it meets your expectation?

Thank you!