Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
  • #661653


    I am very pleased with the parallax effect on desktop with stretched background images in color section.

    But on mobile it’s not fitting to the screen, and the images get very long and cut of.
    I have tried to put this: .avia-section { background-size: 100% 100% !important; }
    and this: .avia-section { background-size: cover !important; }
    for mobile but I don’t get it to work.

    Can I get the image background scale 100% width on mobile some how? That they are horizontal like the “meny(u)” images that scale very well on mobile.

    Kindly regards, Mathilde


    I need the answer to this as well… Following.



    for example use this code:

    #av_section_3 {
    background-size: 209% 91% !important;
    background-position: 53% 90% !important;

    Adjust as needed and use this for your other av_sections as well.

    Best regards,


    Hi Andy, Thanks a lot! Now I managed to adjust it well to how I wanted it:

    And: ewingmh , here’s the code I used in custom css.

    @media only screen and (max-width: 489px) {
    #av_section_1 {
    background-size: 100% 45% !important;
    background-position: 40% 90% !important;
    margin-top: -100px;

    Kindly regards,

    You can close this now. Thanks!


    Hi Mathilde,

    Great, glad you got it working and thanks for sharing your solution :-)


Viewing 5 posts - 1 through 5 (of 5 total)
  • The topic ‘How to scale color section background image to fit on mobile’ is closed to new replies.