Jump to content

Inconsistent Fixed Header When Mobile Device Flipped to Landscape(Brine)

Recommended Posts

Site URL: https://alison-mcgee.squarespace.com/

Hi! I've got a fixed header on my Brine 7.0 site. When using a mobile device flipped in a landscape position, it will do 1 of three things:

  1. List all the folder names in a row so that they're cut off. Fixed header doesn't work.
  2. Folder names stack, but fixed header doesn't work.
  3. Folder names stack and suddenly the fixed header works.

So basically, sometimes it works and sometimes it doesn't. If I refresh my device then it is automatically fixed. 

How do I make it work all the time? 

For your reference, here's the code I added: 

.Header {
  position: fixed!important;
  z-index: 1000;
  width: 100%;

@media screen and (min-width: 640px) {
  .Index section:first-child:not(.Index-gallery), .Main--page, .Intro, .Main {
    padding-top: 81px;
  .Intro + .Main {
    padding-top: 0px;




Link to comment
  • Replies 0
  • Views 274
  • Created
  • Last Reply


This topic is now archived and is closed to further replies.

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.