Nav Menu Responsiveness issues

I have been working with multiple people to try and fix the responsiveness issues in the TOP nav menu for http://blockchaindevelopers.cctravis.com

Still after several days and the efforts from several people a few responsiveness issues remain that I need to solve.

You can see the custom CSS we have trie to use to solve some of these issues.

The top NAV menu will not stay in line. You can see some text and icons are above or below others. I need to figure out how to get this in a straight line no matter the screen size.

Also the Nav menu TEXT is being cutoff as the screen size decreases. I have used the mobile drop down nav menu to appear once it gets to tablet size but for laptops and desktops I can not figure out how to solve the words being cutoff vs just the text size decreasing and the words remaining fully visible in the Nav menu.

If you just slowly decrease the browser size you can easily recreate the issues I am trying to solve.

Thanks for any help you can give.

Hello There,

Thanks for writing in!

  • Please make your menu descriptions in two lines so that it will not occupy a large amount of width for the menu items thus making enough space to display the menu items without cutting it off in smaller screen devices. You can do this by setting a maximum width for the top links menu items.

  • The icons should be aligned by setting the Content Flex Layout to Start and also make sure to add a maximum width.

Hope this helps.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.