Parent sub menu not clickable if other Html element exist inside it

[Shaifullizam]

This work fine

<li class="hemenu-menu-level">
  <span>Recruitments</span>
  <ul class="">
  ...
  </ul>
</li>

But if add another element inside it or wrap the text with div or span like this

<li class="hemenu-menu-level">
  <span>
    <img src="image.jpg" />
    <span>Recruitments</span>
  </span>
  <ul class="">
  ...
  </ul>
</li>

the parent submenu is not clickable. Image and <span>Recruitments</span> not clickable except the right arrow.

My solution is to add css pseudo ::after to outer <span>

and add this css to kinda overlay those img and span element

content: "";
display: block;
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;

[meceware]

Hi,

That works if that works :) Can you send a codepen link so I can investigate?

[Shaifullizam]

@meceware

Here :)
https://codepen.io/kadsyy/pen/KKeGVWP

[meceware]

Hey, thanks for the codepen. I released v1.0.5 with image and other elements support and added a demo for it. To use it, hemenu-span class should be added. Let me know if you see any issues.