Streaming live at 10am (PST)

Mobile odd white margin/padding


#1

Hopefully someone can help...

I have noticed that in the live version of my site on a mobile device our site has a strip of white on the right hand side.

This doesn't show in the webflow preview.

any ideas?

Thanks

Matt


#2

Hello @mattmatson

It is overflow, which caused by one of the headings, there is little left margin. When I turned it off, everything looks good

Regards,
Anna


#3

Hello,

thanks for coming back to me, I have tried that and its still the same issue when looking at it in a LIVE version on iphone. I've checked in device mode on chrome and it looks fine, but thats not the case in LIVE.


#4

Could you provide read-only link to your project? It would help to find the reason of this issue.


#5

thank you

https://preview.webflow.com/preview/dance-days?preview=b612a94a75b70aeb4cc6ae3680e2f1a2


#6

Well, There is some issues with negative margins and structure. I made couple videos to show you more correct method to manage elements. You can fallow my steps for fix overlap problems:
https://drive.google.com/file/d/0B-7cg8BSq1Z_X2ZHYnZJMlZNR28/view?usp=drivesdk
https://drive.google.com/file/d/0B-7cg8BSq1Z_YnVUVzF5ZmZCVWM/view?usp=drivesdk

Or just rough method- make div "NewWorkshop" overflow=hidden, on all devices. It should fix the problem, but will notice again: using negative margins for manage elements positioning is not good practice and better use this methods when nothing else can be done.

Regards,
Anna


#7

Hello Anna,

Thank you so much for going to all this effort for me!!!

I have followed your instructions and republish the site, but, I still have the issue in LIVE on iphone 6s.
In preview mode on webflow everything looks perfect.

I only have an iphone 6s to test on. so im not sure if its the same on other device


#8

I would recommend check other elements with negative margins too.
For example, I found out that div "dance-styles" has negative margins too. If remove that margins it fix overflow.
https://drive.google.com/file/d/0B-7cg8BSq1Z_ekhhLWdaNWF1QzA/view?usp=drivesdk

Cheers,
Anna


#9

THANK YOU!!! Massive help!

grinning


#10

You are welcome smile
P.S. Negative margins are tricky wink


#11

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.