Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].
Hello,
My site was working just fine on Safari (with iOS 9) and then I updated my phone to iOS 9.1. Now the site doesn’t reduce it’s size to fit the screen on iPhones. Some elements do (such as some text) but it seems like the website thinks that the screen is several inches bigger than it is. It works fine on iPad. It seems like Vantage thinks that the iPhone is the iPad size and makes the layout too big for the screen. I’ve had customers report that they couldn’t use my website on their iPhone’s but it worked just fine on desktops and tablets. This is a big issue for me since many people are browsing my site on iPhones. What can I do to fix this problem?
Hi Joshua
I’ve just investigated this and it seems to be related to the heading. The strange thing is after refreshing a few times the issue went away for me. Did you by any chance fix or change something?
I have the Jetpack Photon Plugin activated and I had tried deactivating that for a bit but it didn’t make a difference for me. I have since reactivated it. For the main heading I have the following custom CSS applied:
font-size:calc(100% + 1.2vw); p.small { line-height: 170%; } p.big { line-height: 200%; }I am using this because I want the heading to be large on desktops but yet not too small on mobile. It seems to work just fine on Opera mobile and Chrome mobile browsers. I don’t know if that custom CSS is messing anything up or somehow not compatible with the Safari mobile browser? The strange thing is I have the same CSS applied to several other headings and they don’t have any issues.
It is a possibility that the 9.1 Safari updated introduced some sort of bug that's making the calc based font size go a bit weird on the home page.
What happens if you remove it?
It didn’t seem to make a difference. It is one of the only rows that I have selected as “Full width” and it seems to be the only row that has an issue.
Ok, under “Layout” on the row settings, I had the padding set to “0” so that the picture of the chickens in Santa hats wouldn’t have any space underneath them. I removed that zero and left it blank and that fixed the adjust problem on my iPhone.
Aaah, very well spotted. I’m not sure why that would have been causing an issue, but very good that it’s fixed. I’ll log this as a possible issue on our side so we can investigate a little further.
Yea, that’s the problem. It doesn’t matter what other settings or custom CSS I have, if I set the row padding to “0” it screws up the ability to resize on Safari. I can reliably test this. Weird. Anyway, thanks for your quick response and help!
BTW, I like your theme. I used it several times already and your $15 purchase price is a big draw for me. Plus, it’s very adaptable and the support is very good! A+
Thanks for the very kind feedback and the support Joshua. We’re a small hard working team, so both really do mean a lot :)