In the project I use a menu component with conditional rendering.
The problem happened in the display of menu item separators, because some entries may not be rendered.
Example 1 is the first state when all menu items are visible.
Example 2 and 3 are the state when some elements are not rendered in the component.
I wrote such a selector to hide the line elements.
<style>
.deliver:has(+ .deliver),
.deliver + .deliver:not(:has(+ *)) {
display: none;
}
</style>
Code example https://codepen.io/ivolkoff/pen/ExpKBvg
Top comments (0)