Css polymer core动画页面如何设置可滚动内容的背景

我正在使用核心动画页面。页面上的一些内容需要滚动。我想为页面设置背景色，我想让背景色覆盖滚动区域，而不仅仅是当前视口。我如何做到这一点

更具体地说，我有：

<core-animated-pages flex transitions="cross-fade-all">
<div>Some small content</div>
<div>Some long text that will need to be scrolled</div>
<div>Another page</div>
</core-animated-pages>

从%值和顶部+减去的像素允许顶部的菜单栏和主体上的填充——这些需要根据菜单栏和填充的高度进行调整

现在我想在纸阴影中包裹div，但我发现当我这样做时，我失去了背景。如何将纸张阴影效果应用于div

在

中的

具有

位置：绝对
+
上/右/下/左：0
。您没有提供HTML结构的其余部分以及您定义的任何其他样式，但我假设这就是导致您看到的内容的原因

尝试设置表示页面的DOM元素的样式，以使用
position:relative
（您可以通过为其指定Polymer-shorthand
relative
属性来完成此操作）：



聚合物核心动画页面演示
核心动画页面>div{
背景颜色：橙色；
}
一些小内容
布拉布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫布拉赫
另一页
谢谢。在div上指定relative是我缺少的。我添加了一些额外的标记，使我能够获得覆盖页面其余部分的背景，同时为上面的菜单栏留出空间。我将编辑我的帖子以显示这一点。
#instructions {
  background: #FFF59D;
  min-height: calc(100vh - 200px);
  top:+30px;
  padding:10px;
  width:calc(100% - 24px);
}