Dropdown items within sidebar not selectable - Semantic UI

Question

I'm embedding a dropdown within a sidebar using Semantic UI. When there are other menu items below the dropdown, the choices within the dropdown are not selectable (eg cannot select 'Choice 2' or 'Choice 3' at http://jsfiddle.net/aqr81wzr/1/ ) and the background of the dropdown choices are transparent using the default styling.

However, if the element is a vertical menu without being a sidebar, the elements are selectable. In the fiddle, replace:

<div class="ui left vertical menu visible sidebar">

with:

<div class="ui left vertical menu visible">

I'm clearly not understanding the subtleties between a standalone menu and a sidebar menu. I've tried setting z-index on the dropdown without success.

Answer 1

Got it. The rule

.ui.sidebar>* {
    transform: rotateZ(0);l
 }

is interfering. Override it on your sidebar menu items.

.sidebar > .item {
    transform: initial !important;
}

I would report this as an issue on GitHub, however.