Can we override layout and style changes to the fixed header?

Hey Guys,

We really like our header the way it is and we just want it to stay fixed. However, the fixed header layout and styles are different than the original header we created. For example, the original header layout is navigation bottom, but the fixed header layout that appears after the user scrolls down the page is navigation right.

This new layout causes our navigation menu to wrap onto a second line (not good) and makes the logo too small (not good either). Also, for some reason, the search icon disappears and we lose the navigation background color.

Is there a way to override these changes so we can keep our original header as the fixed header or will this be a giant headache? As I mentioned before, we really like our header the way it is and we just want it to stay fixed.

Thanks for your help!

Andrew

Hi Andrew,

Just a guess (difficult without a site to see?), but maybe you are simply packing too much into the width with too many menu items - perhaps consider introducing a sub-menu or two to reorganise your menu so it is not so wide ?

HTH, Dave

Thanks for jumping in, Dave! You could try Dave’s suggestion, Andrew, but since I can feel the love you have for your header, you can try this method: lose the fixed header then add this CSS snippet.

/* Fix the position of the primary header */
.fl-page .fl-page-header-primary {
  position: fixed;
  width: 100%;
  z-index: 9999;
}
/* Offset the page content */
.fl-page .fl-page-content {
  padding-top: 117px; /* Change to the height of the header */
}

Hope this helps!

Ben