⚡ Quick Fix (TL;DR)

The Culprit: Overlapping elements stack in an order the browser determines on its own, which isn't always the order you want.

The Fix: Raise the element's stacking order above its sibling. Behavior depends on the surrounding stacking contexts – z-index alone doesn't always work as expected if a parent element establishes its own separate stacking context.

.my-element {
  position: relative;
  z-index: 2;
}