Archived topic
screen width - horizontal bar in iphone
4 replies · Started by Sabine on July 8, 2018
Hello there,
I get a horizontal bar in the iphone for the following website
I have tried to put in the bellow but that does not seem to solve the problem
/*get rid of horizontal browser bar*/
body{
overflow-x:hidden;
}
Looking forward to your help as this wobly screen is driving me insane.
Kind Regards, Sabine
Hi there,
That CSS fix above is just a patch and sometimes it doesn't work.
I can't get it to happen on browser re-sizing so it's a bit hard to tell what's causing it.
It's possible that a plugin is causing the issue. Can you try #1 and eliminate any plugin faults?
https://docs.generatepress.com/article/debugging-tips/
Let me know.
You have this CSS added:
.mobile-header-navigation {
padding: 5px;
}
Which is increasing the width of the navigation. If you want to keep the padding, then add this property to the above rule:
box-sizing: border-box;
David, thank you so much! You are a life saver.
I dont know how that came into the custom css (probably while I was previously testing another layout.)
All solved.
Two lesson learned:
1) delete all custom css before you upload a new theme
2) if it has to do with mobile then please do check CSS for "mobile" first
THank you again for your quick help. Have a good day.
Glad to be of help :)