Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #1300575

    Hello
    I want to apply a blur effect in color section with image background.
    I try with css style, with dev > Custom CSS class, and with this css in my child css:

    .head_research_img {
    	filter: blur(5px);
    	-webkit-filter: blur(5px);
    }

    But that blur all ! not only my background
    so I try with just
    backdrop-filter: blur(5px);
    but it doesn’t work either…
    what is the syntax with your frames?
    Thanks
    Seb

    • This topic was modified 3 years, 6 months ago by Nikko.
    #1300785

    Hey Seb,

    Thanks for contacting us!

    Please add your background image as Overlay under Styling tab of Color Section element and then go to Advanced > Developer Settings tab and give your Color Section a custom ID (“blurry-sec” in example below) and then add following code to bottom of Quick CSS field

    #blurry sec .av-section-color-overlay {
        filter: blur(5px);
        -webkit-filter: blur(5px);
        background-size: cover;
    }

    Regards,
    Yigit

    #1300810

    Hi Yigit

    Perfect, Thank you !

    Regards
    Seb

    #1300833

    Hi Seb,

    We’re glad to hear that :)
    Thanks for using Enfold and have a great day!

    Best regards,
    Nikko

Viewing 4 posts - 1 through 4 (of 4 total)
  • The topic ‘Apply blur effect in image full width’ is closed to new replies.