ポリマーペーパーヘッダーパネルが正しくレンダリングされない

ポリマーのペーパーヘッダーパネルに関してStackOverFlowで同様の問題が報告されましたが、解決策は効率的でないか、正しい方法ではありません。それhere。具体的な輸入は、前述の一般的なものではなく、hereとしてください。ポリマーペーパーヘッダーパネルが正しくレンダリングされない

<!DOCTYPE html> 
<html lang="en"> 
<head> 
    <meta charset="UTF-8"> 
    <title></title> 

    <script src="bower_components/webcomponentsjs/webcomponents-lite.min.js"></script> 
    <link rel="import" 
      href="bower_components/paper-header-panel/paper-header-panel.html"> 
    <link rel="import" 
      href="bower_components/paper-toolbar/paper-toolbar.html"> 
    <link rel="import" 
      href="bower_components/iron-flex-layout/iron-flex-layout.html"> 
    <link rel="import" 
      href="bower_components/iron-flex-layout/classes/iron-flex-layout.html"> 

</head> 

<body class="fullbleed layout vertical"> 
    <!-- paper-header-panel must have an explicit height --> 
    <paper-header-panel class="flex"> 
     <paper-toolbar> 
      <div>Header</div> 
     </paper-toolbar> 
     <div>Content</div> 
    </paper-header-panel> 
</body> 

</html>

をしかし、問題は、このインポートはすでに廃止されていることを示します。

それを正しくレンダリングするための私のコードは以下の通りです。

<link rel="import" 
      href="bower_components/iron-flex-layout/classes/iron-flex-layout.html">

新しいクラスを使用することをお勧めします。

<link rel="import" 
      href="bower_components/iron-flex-layout/iron-flex-layout-classes.html">

ただし、ペーパーヘッダーパネルは正しく表示されません。

私は何を逃したのですか？または私の間違いは何ですか？どんな助力も深く感謝します。ありがとう！ソースから

出典

2016-03-24 Ariel Magbanua

：https://github.com/PolymerElements/iron-flex-layout/blob/master/iron-flex-layout-classes.html

あなたがマークアップで直接レイアウトプロパティを指定でき、レイアウトクラスのセット。

このファイルは、使用する必要があるすべての要素に含める必要があります。サンプル使用：
<link rel="import" href="../iron-flex-layout/iron-flex-layout-classes.html"> 
<style is="custom-style" include="iron-flex iron-flex-alignment"></style> 
<div class="layout horizontal layout-start"> 
    <div>cross axis start alignment</div> 
</div> 
次の輸入が利用可能である：

鉄フレックス

鉄フレックス逆

鉄フレックスアライメント

鉄フレックス因子

鉄位位置決め

お客様の用途に合わせてiron-flexとiron-positioningスタイルモジュールを含めるだけでよいでしょう。

Ex。

<link rel="import" href="../iron-flex-layout/iron-flex-layout-classes.html"> 
<style is="custom-style" include="iron-flex iron-positioning"></style> 
<body class="fullbleed layout vertical"> 
    <!-- paper-header-panel must have an explicit height --> 
    <paper-header-panel class="flex"> 
     <paper-toolbar> 
      <div>Header</div> 
     </paper-toolbar> 
     <div>Content</div> 
    </paper-header-panel> 
</body>

出典

2016-03-24 05:10:00

ありがとうございました！ありがとうございました。私は将来このことに注意します。 –

ポリマーペーパーヘッダーパネルが正しくレンダリングされない

答えて

関連する問題