Canvas Support

logo image too wide putting navigation to 2nd line

1 reply · opened Apr 6, 2019

BbagginsApr 6, 2019

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:


        
            
            
                [
![attachment](blahblah.gif)

                
![attachment](blahblah.gif)
](index.php)
SSemicolon WebSTAFFApr 7, 2019

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.

Have the same question, or something new?

Sign in to the Canvas dashboard to reply or open your own topic. Canvas owners get direct help from the SemiColonWeb team.

Reply on the dashboard