Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0
Sign in to follow this  
BCjeff21

Remove header only on mobile with custom CSS?

Question

I'm using the Five Template, and I'm having all kinds of problems with my custom header in mobile. Help referred me here and said custom CSS could fix my issue. I know nothing of web design so that's why I'm here.

Is there a way to disable the header all together for my mobile version only? That way I'll only have the Nav Bar at the top?

Edited by llogan

Share this post


Link to post

6 answers to this question

Recommended Posts

  • 2
Guest

First, see this article on how to use the CSS Editor on your site: https://help.squarespace.com/guides/using-the-css-editor.

Then, simply add this line to the Editor:


@media only screen and (max-width: 640px) { 
    #banner-area-wrapper {display: none;}
}

Note: the max-width property can be adjusted higher if you want to disable the header for tablet sizes as well - typically you'd set it to 1024px instead of 640px.

Share this post


Link to post
  • 0

Thanks I'm trying to do this for Avenue. My URL is https://jamie-stoneham-z906.squarespace.com/config#/design|/coffee-1/

I tried to inspect the element and find what section it was in and used the code:@media only screen and (max-width: 640px){ #extra-wrapper page-header {display: none;}}

but that didn't seem to work as well as #banner-area-wrapper. Please let me know what I am doing wrong. Thanks!

Share this post


Link to post
  • 0

Thanks I'm trying to do this for Avenue. My URL is https://jamie-stoneham-z906.squarespace.com/config#/design|/coffee-1/

I tried to inspect the element and find what section it was in and used the code:@media only screen and (max-width: 640px){ #extra-wrapper page-header {display: none;}}

but that didn't seem to work as well as #banner-area-wrapper. Please let me know what I am doing wrong. Thanks!

Edited by jstoneham3

Share this post


Link to post

Create an account or sign in to comment

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

Sign in to follow this  

×
×
  • Create New...