Dart Polymer 应用程序中的纸张选项卡未正确显示答案

【问题标题】：Paper tabs not showing correctly in Dart Polymer appDart Polymer 应用程序中的纸张选项卡未正确显示
【发布时间】：2015-04-24 03:33:51
【问题描述】：

我是 Dart 和 Polymer 的新手。我正在尝试创建选项卡，但它们无法正确显示。这是我的代码：

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="scaffolded-by" content="https://github.com/google/stagehand">
  <title>Paper Tabs Events</title>

  <link rel="stylesheet" href="styles.css">

  <link rel="import" href="packages/polymer/polymer.html">
  <link rel="import" href="packages/paper_elements/roboto.html">

  <link rel="import" href="packages/core_elements/core_header_panel.html">
  <link rel="import" href="packages/core_elements/core_toolbar.html">
  <link rel="import" href="packages/core_elements/core_pages.html">

  <link rel="import" href="packages/paper_elements/paper_tabs.html">  
  <link rel="import" href="packages/paper_elements/paper_icon_button.html">
</head>

<body unresolved>
  <core-header-panel flex>
    <core-toolbar class="medium-tall">
      <paper-icon-button id="navicon" icon="dashboard"></paper-icon-button>
      <span flex>Main Heading</span>
      <paper-icon-button id="morebutton" icon="more-vert"></paper-icon-button>

      <paper-tabs class="bottom fit" selected="1">
        <paper-tab>IMPORT</paper-tab>
        <paper-tab>DEFINE</paper-tab>
        <paper-tab>DESIGN</paper-tab>
        <paper-tab>DEVELOP</paper-tab>
        <paper-tab>DEPLOY</paper-tab>
        <paper-tab>EXPORT</paper-tab>
      </paper-tabs>
    </core-toolbar>

    <core-pages>
      <div><h1>Core Page</h1><p>This is content for core page.</p></div>
    </core-pages>
  </core-header-panel>

  <script type="application/dart">export 'package:polymer/init.dart';</script>
</body>

一旦它们正确显示，我想在选项卡选择时动态更改选项卡下的内容。但那是为了以后，首先标签需要正确显示。任何帮助将不胜感激。

这是屏幕截图。

https://www.dropbox.com/s/px2as8lor4a67ro/Screenshot%202015-04-23%2022.59.47.png?dl=0

【问题讨论】：

“未正确显示”究竟是什么意思？应该有什么不同？也许你可以添加一个截图。
我现在在问题中添加了截图。

标签： dart polymer dart-polymer paper-elements core-elements

【解决方案1】：

你的 core-header-panel 的父元素需要一个高度（在本例中为 body）。

请参阅https://www.polymer-project.org/0.5/docs/elements/core-header-panel.html 了解更多信息。

TLDR;您可以将“fullbleed layout vertical”作为属性添加到您的身体。

【讨论】：