logo image too wide putting navigation to 2nd line

Question

For screen size around 1024px width, the navigation bar is below the navigation logo. After expanding screen just a little bit, the logo and navbar are on same line. Here is part of code:

SemiColonWeb · Accepted Answer

Hello,

As the Size of the Header decreases on Smaller Devices, the Logo and Menus adjust themselves accordingly which causes this issue. You can consider decreasing the Size of the Logo or the Size of the Text in the Menu or both. Consider using the following codes:

For decreasing the Size of the Logo:

.device-lg #header:not(.sticky-header) #logo img {
    height: 70px;
    margin-top: 15px;
    margin-bottom: 15px;
}

For decreasing the Size of the Text in the Menu:

.device-lg #primary-menu ul li > a {
    padding-left: 12px;
    padding-right: 12px;
    font-size: 12px;
    letter-spacing: 0px;
}

Hope this Helps!

Let us know if we can help you with anything else or if you find any further issues.