NO BUG: Header layout broken after Bricks 2.1.4 update (staging & live)

Hi everyone,
I’ve run into a frustrating issue after updating to Bricks Builder 2.1.4 — both my staging and live sites now have a broken header layout compared to what it should look like.

What’s happening

  • The header displays incorrectly (layout/CSS issues) — elements aren’t aligned, styling is missing, and it doesn’t match the live version.

  • This appears on both staging and live environments after the Bricks update.

  • The HTML structure + menu output is correct, but CSS styling isn’t being applied properly.

This feels like CSS not loading / compiled styles not being applied correctly after the update**
Steps I’ve already tried**

  1. Updated to Bricks 2.1.4

  2. Verified header template and navigation is present

  3. Cleared all caches (server, plugin, browser)

  4. Regenerated CSS manually

  5. Checked DevTools — nothing obviously throwing errors

  6. Deactivated/Activated the plugin

Despite this, the header still appears broken (CSS is not rendering like it should). It’s almost as if styles are not being applied correctly on the front end after the update.

Staging site: https://vhdstudio-staging.nyg1r0.ap-southeast-2.wpstaqhosting.com/
This is how it should look like

**
Browser**: Chrome 110
OS: macOS / Windows / Linux / etc.
URL: Link to a page that illustrates this issue
Video: Short screen recording that illustrates this issue (free tool: jam.dev)

[Please describe this bug in as much detail as possible so we can replicate & debug this bug]

Hi Danyl,
Thanks so much for your report, and welcome to the forum!

We changed the .sticky class to .brx-sticky, but some cached styles still reference the old .sticky class.


Best regards,
timmse

Hi timmse,

Thanks for your patience.

On my end, I can no longer see any cached files referencing the old .sticky class — everything appears to be loading correctly with the updated .brx-sticky class now.

Could you please confirm if this resolves the entire header issue on your side? Specifically:

  • The header container switching from normal content width to full width

  • The broken navigation menu and styles

  • The sticky header styling when scrolling

Once confirmed, we can be sure the caching issue was the root cause. Looking forward to your update.

livesite header without bricks theme update - this is how it should look like

Best regards,
Danyl

Hi timmse,

I’ve got it fixed now — thanks for the tip about updating the class from .sticky to .brx-sticky. I overlooked that we had custom CSS for the header, which was still targeting the old .sticky class. Once that was updated, everything started working correctly again.

Thanks again for pointing that out and for your help!

1 Like

Perfect, I’m glad you were able to sort it out :slight_smile:

1 Like