Archived topic
Page Hero Element not displaying correctly on iPad
3 replies · Started by Matt on May 10, 2021
Hello,
I've created some page hero elements for the posts on my site. An example of a post on my site is https://heretotravel.com/madeira/
While on mobile and desktop, the background image in the hero displays correctly, on iPad, it appears the background image IS loading but it's blurred out and possibly zoomed in. It appears the background image IS loading, but in an unusual fashion.
Is it just me? I've flushed and switched off browser, site and server caches, but it's made no difference.
If it's not just me, what appears to be causing this and how can it be fixed?
Many thanks for your assistance.
Hi there,
Fixed backgrounds on touch devices is generally disabled, and iOS devices have terrible support them - they don't calculate the size based on the viewport anymore which causes them to scale up to huge proportions.
Try adding this CSS to the site to disable fixed backgrounds on touch devices:
@media (pointer: fine) {
.gb-container:before {
background-attachment: scroll !important;
}
}Ahh! That's it!
I've just disabled the fixed background setting as I'm not attached to it. Thanks though for the css fix.
Many thanks as always for the prompt and very helpful reply.
Glad to be of help
