<![CDATA[bar to separate menu elements]]>Hi ! Do you have an idea how I could add vertical bars to separate the elements of my menu as shown on the image ?
I tried to add it before the words but as every element is independant the bar is never centered...

Thank you vm

Capture d’écran 2026-05-22 à 11.05.20.png

]]>https://laythemeforum.com/topic/11914/bar-to-separate-menu-elementsRSS for NodeFri, 22 May 2026 20:23:25 GMTFri, 22 May 2026 09:07:55 GMT60<![CDATA[Reply to bar to separate menu elements on Fri, 22 May 2026 13:29:48 GMT]]>you're welcome! <3

]]>https://laythemeforum.com/post/47333https://laythemeforum.com/post/47333Fri, 22 May 2026 13:29:48 GMT<![CDATA[Reply to bar to separate menu elements on Fri, 22 May 2026 13:29:28 GMT]]>Thank you so much.

]]>https://laythemeforum.com/post/47332https://laythemeforum.com/post/47332Fri, 22 May 2026 13:29:28 GMT<![CDATA[Reply to bar to separate menu elements on Fri, 22 May 2026 13:26:56 GMT]]>I changed the code a little bit. I had one or two things that were not optimal yet. You can copy the code again from my post above.

You will find it in Lay Options . Custom HTML and CSS, and I think it's the very last text box at the bottom.

]]>https://laythemeforum.com/post/47331https://laythemeforum.com/post/47331Fri, 22 May 2026 13:26:56 GMT<![CDATA[Reply to bar to separate menu elements on Fri, 22 May 2026 13:23:49 GMT]]>I can't find the "html at bottom" window you are talking about... thank you very much for your help

]]>https://laythemeforum.com/post/47330https://laythemeforum.com/post/47330Fri, 22 May 2026 13:23:49 GMT<![CDATA[Reply to bar to separate menu elements on Fri, 22 May 2026 13:20:38 GMT]]>then you can adapt the CSS so the line has the right height and spacing.

grafik.png

Try to adapt the CSS using maybe ChatGPT or Gemini or something if you need help with that

]]>https://laythemeforum.com/post/47329https://laythemeforum.com/post/47329Fri, 22 May 2026 13:20:38 GMT<![CDATA[Reply to bar to separate menu elements on Fri, 22 May 2026 13:26:17 GMT]]><script> (function () { var lists = document.querySelectorAll('nav.laynav.primary > ul'); for (var i = 0; i < lists.length; i++) { var ul = lists[i]; // collect the real menu items (excluding dividers) var items = []; for (var c = 0; c < ul.children.length; c++) { var child = ul.children[c]; if (child.tagName === 'LI' && !child.classList.contains('lay-menu-divider')) { items.push(child); } } // insert a divider before every menu item except the first for (var j = 1; j < items.length; j++) { var prev = items[j].previousElementSibling; if (prev && prev.classList.contains('lay-menu-divider')) { continue; // divider already there } var divider = document.createElement('li'); divider.className = 'lay-menu-divider'; divider.setAttribute('aria-hidden', 'true'); ul.insertBefore(divider, items[j]); } } })(); </script> <style> /* Vertical divider line between menu items (JS-inserted <li>) */ nav.laynav.primary > ul > li.lay-menu-divider { display: inline-block; vertical-align: middle; /* vertically centered on the menu line */ width: 1px; /* line thickness */ height: 15px; /* line height */ margin: 0 2px; /* space left/right → breathing room from the text */ padding: 0; margin-top: 5px; background-color: #000; /* black */ } </style>

copy this and put it into "html at bottom"

]]>https://laythemeforum.com/post/47328https://laythemeforum.com/post/47328Fri, 22 May 2026 13:26:17 GMT<![CDATA[Reply to bar to separate menu elements on Fri, 22 May 2026 09:29:07 GMT]]>I tried yes... but as i said i can't manage to center it between the words

]]>https://laythemeforum.com/post/47312https://laythemeforum.com/post/47312Fri, 22 May 2026 09:29:07 GMT<![CDATA[Reply to bar to separate menu elements on Fri, 22 May 2026 09:27:00 GMT]]>Have you added it via css?

]]>https://laythemeforum.com/post/47310https://laythemeforum.com/post/47310Fri, 22 May 2026 09:27:00 GMT