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
  • Created
  • Last Reply

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Popular Days

Posted Images

Create an account or sign in to comment

You need to be a member in order to leave a comment

  • 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.