Reducing padding left/right of logo in nav

Hi, @ambern

As far as I can see, that element doesn’t have any padding rules on it. Instead, it has:

  • .left-menu – 38% width
  • .middle-site-logo – 24% width
  • .right-menu – 38% width

So, you’d have to reduce the middle one’s width and increase the menu’s.

Try adding this in Dashboard – Appereance – Customize – Additional CSS in the Customizer

Here’s some code tested in such way that on smaller screens it doesn’t overlap the logo:

#site-header.center-header #site-navigation-wrap .left-menu, #site-header.center-header #site-navigation-wrap .right-menu {
    width: 40.5%;
}
#site-header.center-header #site-navigation-wrap .middle-site-logo{
    width:19%;
}

You can change those percents as you wish. Just make sure they sum up to 100%

You can learn how to use the Chrome Developer Tools or Firefox Developer Tools to help you see and test changes to your CSS.

Hope this helps,
Kind regards!

@vladytimy this worked well, thank you.

Happy to help! Glad it works!



Source link