Top Navigation

Question

Hello, in scenarios where there are many links in the top navigation the whole nav moves down for a small time leaving a gap above when I reduce the screen size.

I had feedback from you some time ago (1yr) to add this code to the custom css I assume making the text reduce in size until the break point for mobile (992px).

@media (min-width: 992px) and (max-width: 1199px) {
#primary-menu ul li a {
padding: 0 9px;
font-size: 12px;

Is there another way to make the break point at a wider width instead of reducing the text, as that doesn't seem to resolve the issue.
exactly which media queries would i need to change please.

Regards
Matt

SemiColonWeb · Accepted Answer

Hello,

This is Definitely Possible but you will need to move all the #header, #logo and #primary-menu Related CSS Code Blocks in the css/responsive.css File from the @media (max-width: 991px) Media Query to inside the @media (max-width: 1199px) { … } Media Query.

This will enable the Mobile Menu on Screen Sizes till 1199px in Width. Let us know if we can help you with anything else or if you find any further issues.