Css 如何在核心标题面板中，在核心工具栏的接缝上放置一个纸厂，并在其下方放置内容

有没有一种简单的方法可以把一个纸工厂放在一个核心工具栏的接缝上，在它下面的核心标题面板中？核心标题面板使用瀑布式高度，因此可以更改高度

这样做的目的是使它看起来像粉红色按钮，同时使粉红色按钮始终跟踪边缘。

---

如果工具栏很高，但由于用户向下滚动列表，它会收缩，我认为晶圆厂必须随之移动。我能找到的最佳方法包括硬编码工具栏的两种可能高度，以及工具栏使用的过渡

#core_toolbar {
  color: rgb(255, 255, 255);
  font-size: 1.2rem;
  font-weight: 400;
  background-color: rgb(33, 150, 243);

  #create_button {
    position: absolute;
    top: calc(64px - 28px);
    right: 24px;
    z-index: 1;
    transition: top 0.18s ease-in;
  }
}
#core_toolbar.tall {
  #create_button {
    position: absolute;
    top: calc(192px - 28px);
    right: 24px;
    z-index: 1;
    transition: top 0.18s ease-in;
  }
}

html没有什么特别之处：

<core-header-panel mode="waterfall-tall" id="core_header_panel">
  <core-toolbar id="core_toolbar" class="animate tall">
    <div></div>
    <paper-fab id="create_button" icon="add"></paper-fab>
  </core-toolbar>
  <section></section>
</core-header-panel>