Search for answers:
The OptimizePress Support Site Has Moved: Click here to access the new Support site

Background Image not showing in iOs mobile Safari

iOs mobile Safari has a problem rendering fixed background images unfortunately. This is an iOs browser limitation. There is a CSS workaround for this, but note that the background display may not give 100% user experience though.

@media only screen and (max-width: 959px) {
body:before {
content: "";
background-image: url('your background url goes here');
background-size: cover;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
}

Or alternatively, just keep you current settings and then just change the fallback color to be consistent with your branding when your site is viewed on iOs devices.

Try adding this code to Other Scripts >> Custom CSS of your page settings:

@media only screen and (max-width: 767px){
body { background: #2ccca6 !important; }
}

Just replace #2ccca6 with your preferred color. This should help you give your readers a better background color when the background image does not work in iOs browsers.

Didn't find an answer to your question? Contact Our Support Team (Submit a ticket)
Was this article helpful?
0 out of 0 found this helpful
Follow

Comments

Other Help Categories:

Get Started Guide

Watch our Ultimate Getting Started guide video

Pre-Sales Questions

Ask questions before purchasing our products

Login Problems

If you're having issues logging into our members hub

Accounts & Billing

Update your billing, request a refund and other accounts help

API Key Issues

Get help with licensing your site and API key issues

Membership Help

Get help creating Membership portals and courses

LiveEditor Help

If you need help using or troubleshooting the LiveEditor

Integrations

Find out about the many integrations possible with OptimizePress

Affiliate Questions

Have questions about promoting OptimizePress

Clubhouse Questions

Questions about our Clubhouse Membership Subscription