Jump to content

My menu on desktop suddenly isn't vertically aligned, HELP!

Go to solution Solved by tuanphan,

Recommended Posts

I also tried this:

.header-title-nav-wrapper {
     display: flex;
  justify-content: center;
  align-items: center;
}

But it did nothing. I also tried margin-top: -15px; which forced it to center by removing the top portion... however, it only effected the left side and logo, but left the social icons off center. AND it shrunk the overall size of the header which I didn't like. 

Is there something I missed? How do I force it to center everything in the header? @tuanphan any ideas friend?

Link to comment
  • Solution
On 3/10/2022 at 6:22 AM, LeauxFi said:

I also tried this:

.header-title-nav-wrapper {
     display: flex;
  justify-content: center;
  align-items: center;
}

But it did nothing. I also tried margin-top: -15px; which forced it to center by removing the top portion... however, it only effected the left side and logo, but left the social icons off center. AND it shrunk the overall size of the header which I didn't like. 

Is there something I missed? How do I force it to center everything in the header? @tuanphan any ideas friend?

Try adding to Design > Custom CSS

a.header-skip-link.sqs-button-element--primary {
    display: none !important;
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
On 3/13/2022 at 7:27 AM, tuanphan said:

Try adding to Design > Custom CSS

a.header-skip-link.sqs-button-element--primary {
    display: none !important;
}

 

this worked perfectly. thank you! but arghhhh i thought i could figure this out with my novice skills. then you drop code i don't even understand how to read. "a".header? skip-link? what is this code instructing the site to do? is the cause of the problem some invisible button element that threw the alignment out of wack all the sudden? i just want to understand what happened IF possible

 

 

edit: and now that ive gone back, i see it threw the banners i had on my website off alignment. however, i can tell it UNDID the need for me to have custom css to center them correctly. so your code seems to have fixed my banner alignment issues totally. what happened here?

Edited by LeauxFi
Link to comment

I think this code is not good...Do you need another code?

a.header-skip-link.sqs-button-element--primary {
    display: none !important;
}
Quote

 it appears to be an assistive technology element. When display : none is used it removes it from being analyzed by the assistive device.

 Looks bad on screen but if we remove it we cut off folks that use assistive devices!

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
On 3/19/2022 at 3:20 AM, tuanphan said:

I think this code is not good...Do you need another code?

a.header-skip-link.sqs-button-element--primary {
    display: none !important;
}

 

 

i dont think so, its worked out fine for me. I had to go back and adjust some of the other css i had but it all worked out in the end. 

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.