Archived topic

Fluid image on mobile

2 replies · Started by federico alessandro galli on April 8, 2015

Viewing posts 1–3 of 3

April 8, 2015 at 9:35 am #96670

Hi everyone,
sorry for my english :)

I've a problem when I use a page image header, and set on fluid... it works really good on web-site, but not working on mobile...is static and don't have the parallax effect..

Thanks for any idea to solve it!

GP is amasing I'm using all add-ons and is magic

April 8, 2015 at 9:42 am #96674

I forgot to check Notify me of follow-up replies via email... so i comment again.. :P

April 8, 2015 at 3:53 pm #96739

Hi there,

Usually the parallax effect isn't desired on mobile - a little too flashy for such a small screen.

Depending on the aspect ratio of the image, it can look a little off on mobile because the aspect ratio of the header area changes as you reduce the size of the window.

You can try changing the background-size attribute on mobile, and see if you can find an value you like:

@media (max-width: 768px) {
      .generate-content-header {
            background-size: 100% auto;
      }
}

You can find more values you can try out here: https://developer.mozilla.org/en-US/docs/Web/CSS/background-size

Hope this helps :)

This archived topic is closed to new replies.

Start building better websites today.