Homepage Hero Image

Hello,

On the hero image on my homepage, the background image is set to position cover, though because of this the entire image height does not display, and cuts off the imagery awkwardly. Would there be a way to add min-height to it: 576px? I’ve tried a few ways with no luck?

With this same image, as well, I need the white Buy Tickets text on the left and the logo/button on the right to always remain in the blue sky area if possible for readability. However, as the screen size reduces the text and image start to run over the busy part of the background image and it is hard to read.

Is there a fix for these two issues with a background-image such as this?

Thanks for your help with this! <3

Hi There,

Thank you for writing in, you can utilize the Gap element to add a height on your Section. This can also solve your second issue by adding the Gap element below the red button.

Hope it helps,
Cheers!

WONDERFUL… you rock! The gap works great, though in the mobile mode (767px or less), the gap elements are too tall…is there a way to adjust this?

Hi There,

Glad we could help, Gap element has a Hide During Breakpoints option (actually all elements), so you can have 2 gap element with different size, one for desktop and one for mobile alternating with each other.



Cheers!

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