Docs

[Brent Schindel]

I have a static BG with the content floating over the top that resizes to the browser viewport. Works great on the desktop. On Safari iOS it is calculating the height of the whole page, not the viewport so the image is zoomed in pretty far and scrolls with the content. How can I fix this?

The site is

lcseattle.wpengine.org

Thanks

[Rupok]

Hi there,

Thanks for writing in! Unfortunately I can’t access your site as it seems down or URL might be incorrect. Could you check it and make sure it’s up and running?

Cheers!

[Brent Schindel]

This reply has been marked as private.

[Rue Nel]

Hello There,

Thank you for providing the information. I have seen your site and you have added the background image as cover. Please know that background-size: cover will depend on the height of the element you have placed the image with. If you want to just display the image according to the height of the screen, please try updating your css code and use this instead:

body {
    background: url("http://lcseattle.wpengine.com/wp-content/uploads/2016/06/LC-SEATTLE-BG.jpg") no-repeat center center fixed;
    background-color:#cccccc;
    background-size:cover;
}

@media(max-width: 979px){
  body {
    background-size: auto 100vh;
  }
}

To fully understand how background works, please review this topic: https://community.theme.co/forums/topic/section-background-image-2/#post-691126

Hope this helps.

[Brent Schindel]

So I put that code and doesn’t seem to be working. Not sure what I am doing wrong.

[Joao]

Hi Brent,

I tested the credentials given above and don´t seem to be working.

Could you please confirm if they are correct please.

Thanks

Joao

[Author]

Posts