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

Stacking navigation bar problem


KateG

Question

Can anyone help with a problem I've got with the navigation bar stacking in a Brine template. It's absolutely fine on my laptop but when my client logs into my account it's stacked on her laptop and another person has this problem too who's reviewing the site. I didn't put in the URL because the site isn't live yet.

I've used the following code but it hasn't resolved it.

@media screen and (max-width:900px) {
.Header--top {
   display: none;
}
[data-nc-base="mobile-bar"] {
   display: block;
}
}

Link to post
  • Answers 13
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

That totally worked, thank you so much 😃😃

Posted Images

13 answers to this question

Recommended Posts

  • 0
On 7/8/2020 at 6:07 PM, derricksrandomviews said:

This is the link that works but you would need to create a password that allows viewing only. 

You do that in config/settings/site availability  which is the first thing on that panel at the top. 

https://carillon-lobster-xd75.squarespace.com

Hi Derrick - I created a password Acky123

 

Any other help you could offer would be much appreciated. Thanks, Kate

Link to post
  • 0

Works fine on my desktop, menu bar looks as is should, it is not stacking,  In mobile view there is a hamburger menu which works fine, sub menus come up, and all works as it should. FYI if a laptop screen is reduced to a certain point, the hamburger menu will show up and the nav bar gets clipped. SS sites try to adapt to whatever any screen is set to. 

Edited by derricksrandomviews
Link to post
  • 0

Is this what you mean?

If so, it seem to happen around 1095px screen width, this should fix:

@media screen and (max-width:1100px) {
.Header{
   display: none !important;
}
[data-nc-base="mobile-bar"] {
   display: block !important;
}
} 

 

image.png

Edited by rwp
Link to post
  • 0
On 7/14/2020 at 2:08 PM, rwp said:

Is this what you mean?

If so, it seem to happen around 1095px screen width, this should fix:


@media screen and (max-width:1100px) {
.Header{
   display: none !important;
}
[data-nc-base="mobile-bar"] {
   display: block !important;
}
} 

 

image.png

 

On 7/14/2020 at 2:08 PM, rwp said:

Is this what you mean?

If so, it seem to happen around 1095px screen width, this should fix:


@media screen and (max-width:1100px) {
.Header{
   display: none !important;
}
[data-nc-base="mobile-bar"] {
   display: block !important;
}
} 

 

image.png

That totally worked thank you so much! :)))

Link to post

Create an account or sign in to comment

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


×
×
  • Create New...