Overlapping of icons and menu in header - Debut Theme

[DrBPE]

Hi!

I'm having some issues with overlapping of icons and menu in the header. This only happens on smaller screens i.e. tablets/iPads. Both the desktop and mobile version are fine. Can anyone suggest how to correct this?

Thanks!

[Zworthkey · Accepted solution]

@DrBPE 
paste this code on top of the theme.css file.

@media only screen and (min-width: 750px){
ul#SiteNav {
    position: relative !important;
    left: -45px !important;
}
}

Thank You.

[Zworthkey]

hii, @DrBPE 
Kindly share your store URL so,
I can solve it perfectly and give you a proper solution.
Thank You.

[DrBPE]

Store details as follows! It is password protected 🙂

URL is https://drbiancapiscionerielementet.com.au/

Password: gawclo

[Zworthkey · Accepted solution]

@DrBPE 
paste this code on top of the theme.css file.

@media only screen and (min-width: 750px){
ul#SiteNav {
    position: relative !important;
    left: -45px !important;
}
}

Thank You.

[DrBPE]

Thank you so much that worked perfectly! Is there a way to move the search icon to the right to make the spaces between icons more even?

[Zworthkey · Accepted solution]

@DrBPE 
paste this code on top of the theme.scss file.

button.btn--link.site-header__icon.site-header__search-toggle.js-drawer-open-top {
    margin-right: -10px !important;
}

[DrBPE]

Amazing! Thank you 🙂

[Zworthkey]

@DrBPE 
If it is helpful then like and accept my solution.
Thank You.

[Denishamakwana]

Welcome to shopify community.

Please share your store URL and if your store is password protected then provide password too.

[DrBPE]

Store URL is https://drbiancapiscionerielementet.com.au/

Password: gawclo