- January 23, 2020 at 11:31 am #260865
I’ve used Shapely (great theme!) for a while and never seen this problem before. The homepage is not rendering properly on an iPad, but a similar setup is fine on another site. I can’t work out why. I’ve attached two screenshots from Safari’s iPad simulator 768×1024 (it’s the same on the real iPad). The one with an expanse of grass at the top is the faulty render (see the widget in the lower part of the screen is shifted right and clipped); the one with two people at the top shows how it should look (nicely centred, no clipping). Both sites have a homepage beginning with the same two widgets: both are versions of the Shapely parallax widget: the first with a full-width image and the second with an image at the left. It’s the same in both Safari and Chrome. Both sites have the same (latest) version of Shapely.
The faulty site has quite a complex homepage (lots of widgets, some home-made), but I’m 95% sure it was all working fine on an iPad when I built the site. It’s a live site, so I can’t experiment with it too freely.
I’ve noticed one other thing. Even on a wide desktop screen, the site with the iPad problem displays the widgets shifted slightly to the right (larger left margin).
Is this something I’ve done, or is it a Shapely problem, or a bootstrap problem? I’m at a loss to explain it. Any advice much appreciated.
Attachments:January 23, 2020 at 12:21 pm #260877
Hope you are having a good day and thank you for your question 🙂
In order to check your question i need to see your live website, please provide url and i will take a lookJanuary 23, 2020 at 2:25 pm #260908This reply has been marked as private.January 24, 2020 at 10:41 am #261015
Ok, so, your problem is the image under the first parallax image?
If this is the case, this image has big amount of white space around, so, you have to remove this white spaceJanuary 24, 2020 at 4:04 pm #261073
Thanks for the comment, Noda, but the problem affects every front page widget. I’ve downloaded a copy of the site to my local MAMP and I’ll fiddle around with it there, comparing it with a similar site that works until I’ve isolated the problem. My guess is it is related to some CSS I’ve put in. I’ll let you know.January 25, 2020 at 4:15 pm #261171
OK, I’ve cracked it!
It was due to some CSS I added. I tracked it down by first deleting all the CSS I had added. Then I added it back, one item at a time, until the problem appeared. I had been trying to reduce the vertical white space between widgets a bit by reducing the padding in sections. This somehow managed to move every widget to the right. This was only obvious in the iPad portrait layout, when clipping occurred, so I didn’t see it immediately. With this item of CSS removed, the rendering all became as it should be.
Sorry to have taken your time, but the very act of posting the problem concentrated my thoughts and led to the solution. Thanks.January 27, 2020 at 7:14 am #261311
Thanks for sharing that, glad to hear you found it 🙂
I will close this case now
- The topic ‘Responsive view in iPad not as it should be’ is closed to new replies.