聚合物 - 在纸张内制作动画内容

Question

我正在努力学习聚合物。目前，我有一个自定义元素，需要在某些论文中为内容制作动画。为了做到这一点，我目前有以下内容：

<paper-material elevation="4">
  <h4>Hello</h4>

  <neon-animated-pages selected="0" entry-animation="slide-from-right-animation" exit-animation="slide-left-animation">                         
    <div>
      Thank you for visiting. I think you'll enjoy what you're
      gonna find. To dive in, click the "Next" button.
      <br />
      <paper-button>Next</paper-button>
    </div>

    <div>
      some more information
    </div>                          
  </neon-animated-pages>
</paper-material>

奇怪的是，neon-animated-pages元素中的内容无法正确呈现在论文中。我在下面列出了截图，展示了它的呈现方式。

我做错了什么？

Answer 1

如果您查看neon-animated-pages的来源，您会看到它是position: relative div，其子（页面）都是position: absolute（从文档中删除）流动）。

这意味着，除非您为neon-animated-pages元素指定一个高度（通过直接设置height CCS属性或fit或flex类），您将看到这样的溢出。