How to Create a Separation Line Between Menu Names?

Posted in: Newspaper
Post count: 123
Romi
#482932
Aug 3, 2023 at 10:49 am

Halo Team TagDiv NewsPaper Team

How do I create a dividing line between names/items in the navigation menu. Like the following picture.
<div class=”separator” style=”clear: both;”></div>

Thank you very much and see you again

Muhammad Nagib Alaydrus

  • This topic was modified 3 years by Romi.
Post count: 21065
Bettina
#482935
Aug 3, 2023 at 11:09 am

Hello!

For the Header main menu element, there is a setting: https://prnt.sc/rnbcS57hELd1

Thank you!

Post count: 123
Romi
#482965
Aug 3, 2023 at 2:29 pm

Thank you Betina for your response

So how to arrange the height and position of the item. And the separator view in my main menu looks messy and disorganized like this.

<div class=”separator” style=”clear: both;”></div>

I want the separator to look neat and tall like in this picture.

How to make it look the same as the picture above?

Thank you very much and see you soon

Muhammad Nagib Alaydrus

Post count: 21065
Bettina
#482972
Aug 3, 2023 at 4:02 pm

Hello!

You can align the separator, but it won’t touch the border lines: https://prnt.sc/YmVRet8aZ9ZK
But, you can add a CSS code. Follow the steps:
1. Add a class name here: https://prnt.sc/z27iqWK96MjJ

2. In the Live CSS box, add this CSS code:

.td-separator .tdb-menu>.menu-item{border-right:1px solid white;}

3. Apply these settings: https://prnt.sc/VK1rZ3ZIypP3

Thank you!

Post count: 123
Romi
#482975
Aug 3, 2023 at 4:25 pm

Halo Bettina

I’ve tried the technique you recommended and it worked great

Thank you, thank you Bettina you are my hero

May all goodness always be with you and your life is always filled with happiness

Thank you very much, see you again

Muhammad Nagib Alaydrus

Post count: 21065
Bettina
#482983
Aug 3, 2023 at 4:53 pm

Hello!

I’m glad that I could help you!

Have a great day!

Viewing 6 posts - 1 through 6 (of 6 total)
You must be logged in to reply to this topic.