嵌套聚合物元素沒有出現？

一個簡單的嵌套polymer-element內另一個不會顯示：嵌套聚合物元素沒有出現？

的index.html

<!DOCTYPE html> 
<html> 
    <head> 
     <script src="lib/polymer.min.js"></script> 
     <link rel="import" href="elements/indx-grid.html"> 
     <link rel="import" href="elements/indx-griditem.html"> 
     <title>INDX-polymer</title> 
    </head> 
    <body> 
     <indx-grid> 
      <indx-griditem></indx-griditem> 
     </indx-grid> 
    </body> 
</html>

INDX-grid.html

<polymer-element name="indx-grid"> 
<template> 
    <style> 
     @host { 
      :scope { 
       display: block; 
       margin: 20px; 
       border: 2px solid #E60000; 
       background: #CCC; 
       height: 500px; 
      } 
     } 
    </style> 
</template> 
<script> 
    Polymer('indx-grid'); 
</script> 
</polymer-element>

INDX-的GridItem。 html

<polymer-element name="indx-griditem"> 
    <template> 
     <style> 
      @host { 
       :scope { 
        display: block; 
        margin: 10px; 
        border: 1px solid #000; 
        border-radius: 3px; 
        background: #FFF; 
        width: 100px; 
        height: 100px; 
       } 
      } 
     </style> 
    </template> 
    <script> 
     Polymer('indx-griditem'); 
    </script> 
</polymer-element>

奇怪的是，雖然我可以在Chrome中看到它的開發人員工具和CSS屬性是正確的，該元素將不會顯示，甚至沒有「大小提示」，而與Chrome瀏覽器開發工具檢查它。

有人對此有任何線索嗎？

感謝

來源

2013-08-28 Ahrrrin Jon