Issues with displaying background on iPhone and iPad

When ckecking on iPhone in landscape mode, the image background of the homepage gets bigger so it's hard to understand what it is.

On iPad, it doesn't load correctly on landscape or normal mode.

Screenshots and URL provided by internal ticket.

Thanks in advance.

  • Predrag Dubajic

    Hi eTech,

    Hope you're doing well.

    I was checking your site and it seems that the issue is caused by this CSS code:

    #post-21 {
        background-size: cover;
        background-attachment: fixed;
        height: 660px;
    }

    Or to be more specific by this part: background-attachment: fixed;
    When this is disabled or "local" is used on iOS devices the image loads properly again.

    This seems to be a part of some custom CSS that you added so I'm not sure if removing it will affect something else.
    Instead I would suggest applying some CSS for lower screen sizes in order to overwrite that specific that CSS, something like this should do the trick:

    @media only screen and (max-device-width : 1024px)  {
    	#post-21 {
    		background-attachment: local;
    	}
    }

    If other screen sizes are still affected by this you can try using some of the other media queries listed here:
    http://stephen.io/mediaqueries/

    Best regards,
    Predrag

Thank NAME, for their help.

Let NAME know exactly why they deserved these points.

Gift a custom amount of points.