Making Bricks Sticky Header Static at a Breakpoint

As of Bricks 1.9.4, there is no option to set a breakpoint at which the sticky header should stop being sticky.

We can add the following block of CSS code in the header template → Settings → Page Settings → Custom Code → Custom CSS:

@media (max-width: 991px) {
  #brx-header.sticky.on-scroll {
    position: static;
  }
}

Replace 991 with your desired breakpoint.

Reminder: This is how sticky header can be enabled in Bricks when editing the header template ↓

For more/better control of the site header, you might want to use Header Extras / Rows from our BricksExtras.

Instant access to 390+ Bricks code tutorials with BricksLabs Pro

Leave the first comment