我正在尝试复制静态页脚，如图所示here在聚合物芯-集管-面板中。
到目前为止，我有一个核心标题面板，由页脚和带有“fit”属性的主要内容区域组成，因此它可以拉伸到视口的高度。
<body fullbleed layout vertical>
<core-header-panel flex style="background-color: red;">
<core-toolbar id="mainheader">
Header
</core-toolbar>
<div fit layout vertical>
<div flex style="background-color: yellow;">
...
</div>
<footer style="background-color: green;">
FOOTER
</footer>
</div>
</core-header-panel>
</body>
但是，我有两个问题：
我该如何解决这些问题？
聚合物团队提出了其他更接近解决方案的实现方案：爱立信解决方案, 抢解决方案，但是它们都没有解决问题 1，在代码中，页脚位于 core-header-panel 之外，因此即使页脚上方的容器大于视口，页脚也始终可见。
将页脚移动到页眉面板主要内容区域内并弯曲其上方的内容也不起作用。
http://jsbin.com/vopahu/1/edit?html,输出
你可以使用CSScalc如果您愿意在页脚上设置固定高度，则可以使用 函数来计算内容的最小高度。
<style>
core-header-panel {
background: red;
}
#content {
background: yellow;
min-height: calc(100% - 32px /*core-toolbar*/ - 32px /*footer*/);
}
footer {
background: green;
height: 32px;
}
</style>
<core-header-panel>
<core-toolbar>
Header
</core-toolbar>
<div id='content'>
...
</div>
<footer>
FOOTER
</footer>
</core-header-panel>
http://jsbin.com/boyiwumigo/1/edit