Title: Blurry header doesn’t work
Last modified: August 20, 2021

---

# Blurry header doesn’t work

 *  Resolved [wpdevar](https://wordpress.org/support/users/wpdevar/)
 * (@wpdevar)
 * [4 years, 10 months ago](https://wordpress.org/support/topic/blurry-header-doesnt-work/)
 * Hello,
 * recently, when I updated my page design with Elementor my blurry header stopped
   working properly. For some reason, it works only on the first section, and when
   I scroll down the blur stops working (header becomes just transparent). How can
   I fix this?
 * CSS for blurry header:
 *     ```
       .sticky-header {
       	position: fixed;
       	width: 100%;
   
       	background-color: rgba(0,0,0,0.2)!important; 
          backdrop-filter: saturate(180%) blur(10px);
          -webkit-backdrop-filter: saturate(180%) blur(10px);
       }
       ```
   
 * Also, the frosted glass effect doesn’t work anymore…
    it is in the 3rd section(“
   We offer: …” )
 * CSS for frosted glass effect(glassmorphism):
 *     ```
       .frosted-glass {
       	background: rgba( 255, 255, 255, 0.1 );
       	box-shadow: 0 8px 32px 0 rgba( 31, 38, 135, 0.37 );
       	backdrop-filter: blur(10px);
       	-webkit-backdrop-filter: blur(10px);
       	border: 1px solid rgba( 255, 255, 255, 0.18 );
       }
       ```
   
 * The page I need help with: _[[log in](https://login.wordpress.org/?redirect_to=https%3A%2F%2Fwordpress.org%2Fsupport%2Ftopic%2Fblurry-header-doesnt-work%2F%3Foutput_format%3Dmd&locale=en_US)
   to see the link]_

Viewing 3 replies - 1 through 3 (of 3 total)

 *  [victoros](https://wordpress.org/support/users/victoros/)
 * (@victoros)
 * [4 years, 9 months ago](https://wordpress.org/support/topic/blurry-header-doesnt-work/#post-14817023)
 * Hey, it’s possible that some of your CSS became broken/ Elementor’s update made
   the effects incompatible.
 * The following list of steps goes from easier possible culprits to more advanced
   ones:
 * Regenerate the CSS via Elementor > Tools > Regenerate CSS on your WordPress Dashboard.
 * From Elementor > Settings in the Advanced tab in the WordPress dashboard, switch
   the CSS print method to Internal embedding.
 * If those steps didn’t help, go to Elementor > tools and enable the safe mode 
   setting there.
 * “Safe Mode” is a safe environment that isolates Elementor and WordPress from 
   all themes and plugins. If it helps, Deactivate your plugins one by one until
   you find the culprit.
 * If it deactivating plugins doesn’t help, switch your theme (temporarily) to a
   default WordPress theme such as Twenty Twenty One and see if it makes any difference.
 * Switch the CSS print method back after following these steps, regardless if it
   helped or not.
 * As a last resort option, you can Rollback your plugin to Elementor (core) 3.3.1,
   [follow the steps in this guide​.](https://elementor.com/help/rolling-back-to-a-previous-version-of-elementor/)
   Make sure to take a backup before doing this step.
 *  Thread Starter [wpdevar](https://wordpress.org/support/users/wpdevar/)
 * (@wpdevar)
 * [4 years, 9 months ago](https://wordpress.org/support/topic/blurry-header-doesnt-work/#post-14832252)
 * Hi [@victoros](https://wordpress.org/support/users/victoros/),
 * I tried all the methods, but even rollbacking didn’t help (I am right now on 
   Elementor 3.3.1)
 *  [victoros](https://wordpress.org/support/users/victoros/)
 * (@victoros)
 * [4 years, 9 months ago](https://wordpress.org/support/topic/blurry-header-doesnt-work/#post-14840046)
 * Since this query is regarding your CSS, may opt to visit our Github account where
   you may get in contact with a member of our development team to query this with.
   
   [https://github.com/elementor/elementor/issues](https://github.com/elementor/elementor/issues)
 * Please note that this is not an official support channel but a respective member
   of the development team will respond to your post as soon as they are available.
 * Please follow this guide which outlines the steps required to post on our Github:
   [https://github.com/elementor/elementor/blob/master/.github/CONTRIBUTING.md&#8221](https://github.com/elementor/elementor/blob/master/.github/CONTRIBUTING.md&#8221);

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘Blurry header doesn’t work’ is closed to new replies.

 * ![](https://ps.w.org/elementor/assets/icon-256x256.gif?rev=3444228)
 * [Elementor Website Builder - more than just a page builder](https://wordpress.org/plugins/elementor/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/elementor/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/elementor/)
 * [Active Topics](https://wordpress.org/support/plugin/elementor/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/elementor/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/elementor/reviews/)

## Tags

 * [css](https://wordpress.org/support/topic-tag/css/)
 * [header](https://wordpress.org/support/topic-tag/header/)

 * 3 replies
 * 2 participants
 * Last reply from: [victoros](https://wordpress.org/support/users/victoros/)
 * Last activity: [4 years, 9 months ago](https://wordpress.org/support/topic/blurry-header-doesnt-work/#post-14840046)
 * Status: resolved