Jump to content

Remove FIXED POSITION header on MOBILE only

Recommended Posts

  • Replies 7
  • Views 1.2k
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images

21 minutes ago, LucyBold said:

This is the website www.lacalifornie.es

Add these code on Custom CSS panel in Website Utilities Website Tools > Custom CSS.

@media only screen and (max-width: 767px){
  #header.shrink {
    visibility: hidden !important;
  }
}

 

If my comments are useful, please like and mark my solution as answer. It will encourage me. Thanks

MD Rofik
Website Designer and Digital Marketer

Am I helpful? Want to offer me a coffee?
Send me a message if needed any help. I'll try to reply as soon as possible.


 

Link to comment
11 minutes ago, LucyBold said:

Thanks so much @Web_Solutions!
It worked perfectly BUT i wonder if there is a way to make the header appears back smoothly when scrolling down back to the top. Right now it does a weird jump. See attachment. 

Thanks in advance!

 

Can you replace the previous code with the code below?

@media only screen and (max-width: 767px){
  #header.shrink {
    position: absolute !important;
  }
}

 

If my comments are useful, please like and mark my solution as answer. It will encourage me. Thanks

MD Rofik
Website Designer and Digital Marketer

Am I helpful? Want to offer me a coffee?
Send me a message if needed any help. I'll try to reply as soon as possible.


 

Link to comment
2 minutes ago, LucyBold said:

Did you meant this?

Screenshot_414.png

If my comments are useful, please like and mark my solution as answer. It will encourage me. Thanks

MD Rofik
Website Designer and Digital Marketer

Am I helpful? Want to offer me a coffee?
Send me a message if needed any help. I'll try to reply as soon as possible.


 

Link to comment

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.