A
alaninsitges
New Member
Hi there Elementorinos,
I'm trying to add a vertical separator to a menu, so that it looks like this:
MENU ITEM A | MENU ITEM B | MENU ITEM C | MENU ITEM D
Adding a border to the right of each menu element is easy enough with CSS, but I've run into trouble when I want to specify different behavior for the last menu element, and thus not have the vertical line appear after it. It's not clear to me the context returned by the "selector" option in custom CSS. Which of these elements is it returning when I use it on a menu widget?
nav #menu-1-7cc041d li a.elementor-item span span.trp-ls-language-name
And further, once I know the context, how can I navigate through the DOM? I am supposing that the context returned above is the li, and therefore I should be able to do something like selector.parent.last-child a {} to style only the last item in a menu. But it doesn't seem to work (I'm aware that parent isn't valid, just using it as an example).
Can anyone shed some light on how to get the last child of a list of elements in custom CSS? Or is there an easier way to accomplish the separator that I'm not aware of?
Thanks very much.
I'm trying to add a vertical separator to a menu, so that it looks like this:
MENU ITEM A | MENU ITEM B | MENU ITEM C | MENU ITEM D
Adding a border to the right of each menu element is easy enough with CSS, but I've run into trouble when I want to specify different behavior for the last menu element, and thus not have the vertical line appear after it. It's not clear to me the context returned by the "selector" option in custom CSS. Which of these elements is it returning when I use it on a menu widget?
nav #menu-1-7cc041d li a.elementor-item span span.trp-ls-language-name
And further, once I know the context, how can I navigate through the DOM? I am supposing that the context returned above is the li, and therefore I should be able to do something like selector.parent.last-child a {} to style only the last item in a menu. But it doesn't seem to work (I'm aware that parent isn't valid, just using it as an example).
Can anyone shed some light on how to get the last child of a list of elements in custom CSS? Or is there an easier way to accomplish the separator that I'm not aware of?
Thanks very much.