Main Menu Items - Question | JoomShaper
Black Friday sale is live with flat 50% OFF. Sale ends soon! Grab your deal now!
Back to the questions

Main Menu Items

M

Mindsugar

Template 4 years ago

Hi there,

with a certain resolution my main menu items move out of position because there is not enough space: In this case I want neither that only the off-canvas-menu is available, or that the search-field and login button disappears, so that there is enough space for the rest of the menu.

Can you pls help me out?

Thanks in advance

Mindsugar

0
2 Answers
Order by
Oldest Newest Votes
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 4 years ago #41998

Hi, On resolution 1398px mobile (off-canvas) menu doesn't make sense. It's easier to reduce space between menu items and size of search field which take a too much space. Yes, I talk to do this only on this and smaller resolution using custom CSS.

BTW

Maybe you should replace search field with new menu item with just search icon, hmm.

0
Paul Frankowski
Paul Frankowski
Accepted Answer
Senior Staff 4 years ago #41999

Maybe start from this example CSS code, which I use very often in my projects:

@media (max-width: 1399px) { 
.sp-megamenu-parent > li > a, 
.sp-megamenu-parent > li > span {padding: 0 10px;}
body.ltr .sp-megamenu-parent > li.sp-has-child > a::after, 
body.ltr .sp-megamenu-parent > li.sp-has-child > span::after {margin-left: 3px;}
}

You can also reduce font size a little bit etc. many thing you can do to safe space.

0