[dominic.peer]

Hi,

i have the problem that I make a header graphic and then of course they are output responsive on the different devices.
Unfortunately, images sometimes slip so much that they are no longer recognizable on the mobile device. Example below.

Is there a way to set different header graphics between desktop and mobile or another possibility?

Desktop
Mobile

Additionally I wanted to ask if it is possible to reduce the header graphic height?

Thanks and best regards,
Dominic

[Althemist]

Hi Dominic,

No, I am afraid there is no way to set different images for desktop and mobiles. It was meant to be used with decorative images, no with images containing important visual message.

Basically, the image is aligned to center with a size that always cover the entire space. So on some resolutions it resize proportionally to make sure the entire area is covered.

Reducing the height is possible with CSS.

You can also adjust the image position for mobiles with media queries, but that would require expert level CSS knowledge and may not work well for all pages.

[dominic.peer]

Hi,

thanks for your answer. 🙂

Regards,
Dominic

[Author]

Posts