Preventing the contents of draggable polymer elements from being selectable

问题

I have a polymer element defined as follows

<polymer-element name="draggable-list-item" >
  <template>

    <core-style ref="draggable-list-item"></core-style>

    <div id="row-container" draggable="true">
      <content></content>
    </div>

  </template>
  <script type="application/dart" src="draggable_list_item.dart"></script>
</polymer-element>

I know that for normal elements (non polymer / web component) that I need to add a style like

  [draggable] {
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    user-select: none;
  }

And everything is awesome

I can't get this to work with polymer. I can drag the item if I select it outside of the contents of the child polymer element. But not over it. I've tried various variants of

  [draggable]  /deep/ * {
    -moz-user-select: none;
    -khtml-user-select: none;
    -webkit-user-select: none;
    user-select: none;
  }

but nothing seems to work

来源：https://stackoverflow.com/questions/26271903/preventing-the-contents-of-draggable-polymer-elements-from-being-selectable