I'm trying to make certain elements on my page draggable. These elements have transform: translate3d() applied to them, but when running

```
$(".draggable").draggable();

```

it makes the elements ignore the transform: translate3d() CSS style. Here's a JS fiddle showing the problem:

<https://jsfiddle.net/snbe92ff/>

The yellow bar on top of the orange box is not supposed to be visible, yet, when draggable() is used, it is. I'm not sure why this happens. According to chrome, no styles are overridden, but these classes are added to the elements:

```
ui-draggable
ui-draggable-handle

```

Looking at the jQuery source code, no transform is happening there either. So why is transform: translate3d() being ignored when draggable() is executed, and how do I fix it?