ポリマー1.6：要素がスタイリングされていない

私はポリマー要素を持っています。私はいくつかのビデオやドキュメンテーションを見てきましたが、IDを含めてすべてのことについて話していて、正常に機能するようにスタイリングするだけですが、そうではありません。ポリマー1.6：要素がスタイリングされていない

私はここにコードを持っている：http://codepen.io/nanobird_/pen/pEWWqW/

は、これは私のDOMモジュールのコードです：

<script src="https://cdnjs.cloudflare.com/ajax/libs/polymer/0.5.6/polymer.min.js"></script> 

<dom-module id="kink"> 
    <template strip-whitespace> 
     <style> 
      :host { 
       display: inline-flex; 
       border: 1px solid black; 

       z-index: 0; 
       line-height: 1; 

       height: 40px; 
       width: 16em; 
       margin: 2px 8px; 
      } 

      #kink-color { 
       width: 4px; 
       background-color: aquamarine; 
      } 

      #kink-text { 
       background-color: green; 
       margin-left: 4px; 
       text-overflow: ellipsis; 
      } 
     </style> 

     <div id="kink-color"></div> 
     <div id="kink-text"><content></content></div> 
    </template> 



    <script> 
     Polymer({ 
      is: 'kink', 

      properties: { 
       pref: String 
      } 
     }); 
    </script> 
</dom-module> 

<kink pref="yes">Kink</kink>

カスタム要素はdiv要素グループはほんの少し色見本とIT-ボックスの下にどのように見えるかのようになります。左に色があります。

私はここで間違っていますか？

出典

2016-10-03 RobotGryphon

カスタム要素には名前に '-'が必要です。ポリマー要素は全く初期化されていないようである。コンソールログでエラーを確認してください。 –

@GünterZöchbauer言うまでもなく、私は今や馬鹿のように感じます。それはどこに文書化されていますか？そしてそれを答えとして受け入れるための投稿をすることができますか？ – RobotGryphon

明示的に探していないと見逃しやすいです... –