Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search

werickson

Squarespace Employee
  • Content Count

    63
  • Joined

  • Last visited

Recent Profile Visitors

The recent visitors block is disabled and is not being shown to other users.

  1. the issue with this is that the code provided only works for Index Pages with banner images - for this to work on different pages you would need to manually write code that would apply to each different page type for your site. I would recommend to redesign your site so every page is an Index Page. Use this image as the banner image: https://static1.squarespace.com/static/54c13dc2e4b01648ee2bf6c0/t/5b71beb470a6ad9686585ff0/1534181044869/Teach+With+Us+%E2%80%94+ChatENG+2018-08-13+12-56-55.png Try it out
  2. .Header-inner { z-index: 9999; width: 100%; } .Header{ z-index: 9998; position: fixed; width: 100%; } @media screen and (max-width: 3000px) { .Index-page--has-image .Index-page-content { margin-top:104px !important; } } @media screen and (max-width: 500px) { .Index-page--has-image .Index-page-content { margin-top:0px !important; } }
  3. .Header-inner { z-index: 9999; width: 100%; } .Header{ z-index: 9998; position: fixed; width: 100%; } @media screen and (max-width: 3000px) { .Index-page--has-image .Index-page-content { margin-top:104px !important; } } @media screen and (max-width: 500px) { .Index-page--has-image .Index-page-content { margin-top:0px !important; } }
  4. I added code to A) fix the height of the banner image and B) make sure it doesn't affect mobile devices. Not sure if you saw the new code I added there: .Header-inner { z-index: 9999; width: 100%; } .Header{ z-index: 9998; position: fixed; width: 100%; } @media screen and (max-width: 3000px) { .Index-page--has-image .Index-page-content { margin-top:104px !important; } } @media screen and (max-width: 500px) { .Index-page--has-image .Index-page-content { margin-top:0px !important; } }
  5. Fixed Navigation on desktop (NOTE: This is only for Index Pages, for other pages the header will overlap the Page Content) .Header-inner { z-index: 9999; width: 100%; } .Header{ z-index: 9998; position: fixed; width: 100%; } @media screen and (max-width: 3000px) { .Index-page--has-image .Index-page-content { margin-top:104px !important; } } @media screen and (max-width: 500px) { .Index-page--has-image .Index-page-content { margin-top:0px !important; } } (You may need to tweak the margin-top to work with your own site - 104px works with the default header height for Brine) This
  6. change the z index header { z-index: 9999; position: fixed !important; width: 100% !important; }
×
×
  • Create New...