Designing fixed headers

When you use the theme layout to design your own header, you have the option to select a "Fixed Header". This will ensure that your logo and menu in the header stay visible as a user scrolls the website.

Video walkthrough

In this video, we unpack:

  • Best practices
  • How to design a header
  • How to make it mobile friendly
  • CSS trick for larger fixed headers

Watch the video below to follow along:

CSS Snippet

If you wish to use the CSS snippet illustrated in this video, please use the following with care:

.fl-theme-builder-header-shrink .scrollhide {

display: none;


Still need help? Contact Us Contact Us