Menu in 2 lines

Multiline Menus See here: https://kriesi.at/documentation/enfold/menu/#multiline-menu

by the way – if you like to have the menu floats right:
set that rule to
justify-content: flex-end;

in this case i would it do the way you do ( with a br inbetween the lines) but give the menupoint a custom class.
Do you know how to?
On menu there is on top of the window in the right corner a flyout “Screen Options”
– there you have “Show advanced menu properties” – mark : CSS Classes.
So now you can give to each menupoint a custom class.
i gave to the concerning menu-point the class: twoliner

try than the following values in your quick css:

.twoliner a {
    line-height: 25px !important;
}

.twoliner a {
    line-height: 25px !important;
    height: auto !important;
    transform: translateY(50%);
    position: relative;
}

.twoliner .avia-menu-fx {
    bottom: -3px !important;
}

these have to be adjusted to your dimensions. If we can see a link it would be more easy to advice
you can see it here on the right side of my testpage menu: https://webers-testseite.de/

if you like to have the text centered add the rule to the anchor element .twoliner a :
text-align: center;

Hello,
I want to achieve exactly the same as sitadi but without a shrinking header. So I added your code but the space between the first and second line is too wide. I want the second line to be directly below the first one. I also want the white line to stay at the same height as the others.
Is that possible? How should I do it?

My code so far is

.twoliner a {
    line-height: 25px !important;
    text-align: center !important;
}

.twoliner a {
    line-height: 25px !important;
    height: auto !important;
    transform: translateY(-30%);
    position: relative;
}

.twoliner .avia-menu-fx {
    bottom: -3px !important;
}

This is how it looks like: picture

Thank you in advance!
Best regards

The link to the actual result is in the private content field. It is in the horizontal main menu

It works so far, thank you!
The only thing still not so nice is that the white line is higher than the other ones. Is there a possibility to fix this?
Screenshot

Dear All,

I need some help, please. I’d like to split the main menu in two rows from a certain menu item. I tried almost all the codes I found in the forum but none of them seemed to work. One code made my mobile menu disappear, the others weren’t functioning either.

Will you please help?

Thanks in advance.

Hi Rikard,

thank you for the reply. I attach a screenshot. The red line indicates the menu item from I’d like to wrap the rest of the menu items wrap under the first line. Basically I’d like to wrap 4 menu points under the 6 first menus.
How is this possible?

Thanks in advance.

Hi Mike,

thank you, yes, indeed. However, do you think the menu can get closer to the logo? ThereÍs a huge gap between the logo and menu.

Thank you in advance.

And the link in private content

Hi Mike,

thank you again, this looks great now:)