Gap at Home Page in the mobile version

Hello.
When I open my Home Page on a mobile device there is a big gap between the header and the content of the page.
I read in the forum that you suggested in answer to this problem to change the margin of the first line to -40.
I have two issues with this solution:

1. The first line in the desktop version is disabled on mobile. Thus, the second row of the page becomes the first row in mobile.

2. The gap appears on Mobile view. On the desktop everything looks just fine. I do not want to change the view in the desktop version.

I would appreciate your prompt reply. Thanks! 🙂

Hello,

Please provide your site admin access to the private area.

Best Regards

See attached.
Thanks

Hello,

You should have added the -40px top martin to the first row: https://gyazo.com/d3b11475d5b6618255016adfcc595f21

Please check your site now.

Best Regards

Hi. Thanks.
Now in the desktop view the first row is too close to the header. And in the mobile display there is still a gap.

Hello,

You can add padding to the row or add one more column with padding and hide it on the mobile.

Please provide the screen from you phone.

Best Regards

Hi. I’m back 🙂
I added padding like you said. On the desktop it looks good. But there is still a gap in mobile.
Attached is a screenshot.

Attachments:

You must be logged in to view attached files.

Hello,

Please check your page now.

You have added a negative margin to the row, which moves the row up, and added 40px padding what moves the columns down.
You have hidden the columns on mobile and padding in the row left, which creates this gap.

I have removed the padding from the row and put it in each column, now looks better.

Best Regards

Thank you.
But now when loading for the first time on a desktop the first row is truncated. (Only after refreshing the page does it look good).
And also – in the mobile display there is still a gap.
See files.

Attachments:

You must be logged in to view attached files.

Hello,

I do not see the problem: https://gyazo.com/e3d50391d00bfe7bb45fe8450524ffb2

What device and browser do you use.

Best Regards

I use Mac Air. Both Safrai and Chrome. I now deleted the cookies in both browsers and it really worked out. Thanks for that.
But the header for some reason still does not shrink when scrolling.

Hello,

When you resize the window you need to reload the page, on mobile devices it works correctly.

Best Regards

[Author]

Posts