If you look at the original screen shot you will see the issue. The only way I could get round it was to change the header menu to full width which is what I have done. If I switch off full width the menu and icons overlap.
Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):
@media only screen and (max-width: 1200px) and (min-width: 1000px) {
#header-outer #top nav .sf-menu > #social-in-menu {
position:relative;
left:-30px;
}
}
Hi Tahir,
We've noticed an issue with the social icons overlapping the burger menu on tablet and phone. Can you supply some code to resolve this issue please.
Thanks,
Steve
Hi there,
Thanks for getting in touch.
I can't seem to replicate the issue from my end. Please clear your browser cache and see if the issue persists
See the attached screenshot and screencast
https://www.loom.com/share/1f86d0b2f2924fcf94b6b8d49d7ee5ab
Kind Regards
Hi Andrew,
If you look at the original screen shot you will see the issue. The only way I could get round it was to change the header menu to full width which is what I have done. If I switch off full width the menu and icons overlap.
Cheers,
Steve
Hey Again,
See screenshot : http://prntscr.com/qkazt3 .
Add this into the Custom CSS box located in your Salient Options panel (All custom css provided is tested in the Live Browser so it will work as intended . If you cant see any changes make sure there is no red cross in the Custom CSS Box as that syntax error would cause all css below it to not show up on the Frontend):
@media only screen and (max-width: 1200px) and (min-width: 1000px) { #header-outer #top nav .sf-menu > #social-in-menu { position:relative; left:-30px; } }Thanks
ThemeNectar Support Team
Awesome as always.