core-header-panel中的core-splitter没有100%的高度？答案

【问题标题】：core-splitter within core-header-panel doesn't have 100% height?core-header-panel中的core-splitter没有100%的高度？
【发布时间】：2014-08-05 07:43:39
【问题描述】：

下面是我的 HTML 正文。

01 <body fullbleed layout vertical>
02 <template is="auto-binding">
03 
04    <!-- Content -->
05    <core-header-panel flex>
06        <core-toolbar>
07            <div>Hello World!</div>
08        </core-toolbar>
09        <div horizontal layout>
10            <div>left</div>
11            <core-splitter direction="left"></core-splitter>
12            <div flex>
13                <!-- I have some looped elements here-->
14            </div>
15        </div>
16    </core-header-panel>
17    <!-- /Content -->
18 </template>
19 <!--scripts loaded here-->
20 </body>

这是它在浏览器中的样子：

所以在我将 CSS 添加到第 09 行之前，我想我会看看是否有人知道解决此问题的聚合物（flexbox）方法。

【问题讨论】：

标签： polymer flexbox

【解决方案1】：

core-header-panel 使用绝对和相对定位 div 的组合。
主要内容的插入点被包裹在一个带有position:relative的div中

因此，最简单的解决方案是将fit (docs) 属性添加到您的<div horizontal layout> 元素中。

见here。

【讨论】：