Hover over elemet is not working with margin, how to solve this?

Hi Friends!

When I hover with the mouse over an icon then then a small side menu with some margin gets displayed, but it is not possible to make a selection inside the menu because the margin around the menu will close the menu when the mouse is trying to make a selection.

For better understanding please watch this short screenrecordning, then you will understand it immediatly :smiley:

link to screenrecording

Of course I could disable the margin, but for design resons I would like to keep the margin. Another option would be to make a border in the same color like the background, but in this case the background color changes for different sites.

Is there any other work around to keep a visual space and still got the option to hover over the menu without closeing it??

Thanks for help!!

Perhaps you could have another div inside the drop-down menu. The parent div can be transparent and the child div can have a margin equal to that you want.

1 Like

Oh of course! I guess that should work :slight_smile:

margin is not working here, it just provides the same problem. However we can use padding for the parent container and set the background-color to transparent

1 Like