BG image showing half way on mobile

Hi,

Tried everything available online to solve this issue but still no success.

Here is my read-only project link https://preview.webflow.com/preview/qreachdash?preview=b8a7e70145d2c668a46bcf987d99ac3e

Last thing I tried was this (given by WF support): http://www.youtube.com/watch?v=h9l9IaspZTI

Didn’t work either!! still gives me a resized to half view image on the background instead of full background “even though inside webflow is showing that everything is OK”

cheers
sam


Here is my public share link: LINK
(how to access public share link)

Hi @Sambatia, thanks for creating a new post. Could you also please inform what mobile device you are using ?

Thanks in advance!

Hi Dave,

I’m using iPhone 5

cheers
sam

Try changing the background from “fixed” to scroll on mobile. I have a feeling the “fixed” setting is restricting the background image size.

not working.

also, I just noticed that the autofocus is not working on mobile too. On WF when I click “enter pin” it then autofocus on the pin box that will appear next, but when I publish the website and try it from my phone it doesn’t move the focus to anything at all.

I think I did something that made it work,

I set the BODY to overflow AUTO
I made a new section and gave it a name “bground”
I set the bground section to 100% width and height, overflow AUTO, position fixed and selected cover, z-index -1.
Then I added a background image to the bground section, made it centered, COVER, no repeat, fixed.

it looks like it is a good work around, but will test it on android and let you know.

cheers
sam

The autofocus doesn’t work still!! any ideas?

I think you could also use a background gradient and not worry about the image. It won’t work on older Androids but I think it’s pretty widely supported otherwise.

This topic was automatically closed 60 days after the last reply. New replies are no longer allowed.