Full width image

Hi mrivanp!

Which are do you want to use that image at?

Cheers!
Basilis

Hey!

Try using a Color Section (set the image as the background of it).

Regards,
Josue

Hi!

You can add this to the Quick CSS:

#av_section_1 .av-parallax {
    background-size: 100% 100% !important;
    height: 100% !important;
    width: 100% !important;
    transform: none !important;
}

But as the section width is equal to the full width of the window size the image will be stretched based on that.

Cheers!
Josue

Hey!

Can u show us the code you are using, and let us know where you adding it?

Cheers!
Basilis

Try with this code instead:

#av_section_3 {
    background-size: 100% 100% !important;
}

Regards,
Josue

That’s expected, the section width is equal to the full width of the window size so the image will be stretched sized based on that. One thing you could do is to set a minimum height to the section (~300px). If that doesn’t satisfy you, remove the background image from the section and place it inside of it instead (as an image elemen), then add this to Quick CSS:

.responsive #top #av_section_3 .container{
    max-width: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
}

.responsive #top #av_section_3 .content{
    padding: 0;
}

.responsive #top #av_section_3 .avia_image {
    width: 100%;
}

.responsive #top #av_section_3 .avia_image img {
    display: block;
}

Regards,
Josue