3 replies · opened Jun 28, 2016
The nav links make a new row at the bottom of the logo when screen is less than 1200 px. How can i prevent this state. The new row has no background and the links mess up with the page content. I want that it behaves like menu-3.html example. It happens because my links are longer?
Hope you can help me. Thanks
Hello,
Yes this is because there are more Items in the Menu than the Current Width of the Menu can accommodate. So please consider adding the following CSS Code:
.device-md #primary-menu ul li > a {
padding-left: 10px;
padding-right: 10px;
}This should definitely fix the issue. Let us know if we can help you with anything else or if you find any further issues.
Why some padding fix it? i want to know. Thanks the menu now can accommodate in one row. But the transition when scroll down is not smooth. Header becomes smaller(good) and the menu stays down but with transparent background after a second it reaches its natural position on the header.
Hello,
Since the Number of Items in the Menu are more than the Available Area it is important to adjust the Padding and Font Size to make the Menu on a Single Line. We Really Apologize but we could not check the Video. Can you host it somewhere else and provide us with a Link so that we can check the exact issue with this.
Additionally, it would also be helpful if you could please let us know which Browser and OS you are using currently so that we can investigate this issue further. Thanks for your Patience.
Meanwhile, do let us know if we can help you with anything else or if you find any further issues with Canvas.
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