(refresh theme) My sticky announcement bar overlaps sticky header

[AdornMens]

Hey, I have searched everywhere and tried older "solutions" and codes to no avail.

I am just trying to get the header and announcement bar to both stay sticky without them overlapping during scrolling.

The domain is adornmens.com

[BSS-TekLabs]

Hello @AdornMens 
Our team is ready to help you.
Please share your website address and access password (if necessary) so that we can check and assist you.

[AdornMens]

Hey the site access password is : ShopifySteph

Both S are uppercase

Domain is adornmens.com

Thanks in advance 🙂

[BSS-TekLabs]

Wrong password!

Can you check  again

[AdornMens]

Sorry. It should work now, that is my fault.

[BSS-TekLabs · Accepted solution]

- Here is the solution for you @AdornMens 
- Please follow these steps:

- Then find the base.css or theme.css file.
- Then add the following code at the end of the file and press 'Save' to save it.

 

.section-header {
    top: 40px !important;
}

- Here is the result you will achieve:

- Please press 'Like' and mark it as 'Solution' if you find it helpful. Thank you.

[AdornMens]

Perfect! and i appreciate how quick you got back to us. Thank you

[BSS-TekLabs]

Glad to help you. Have a good day.

[AdornMens]

While we are here, i figured i'd ask. There is a slight overlap on mobile when scrolling. Can you recommend any css for that ?

[BSS-TekLabs]

@media only screen and (max-width: 750px) {
.section-header {
    top: 53px !important;
}
}

Can you add more this code @AdornMens 

[AdornMens]

Hello I added the code, but it is still overlapping.