为什么底部和右侧不起作用？

Question

我有一个布局，如下所示：

我正在尝试将 div 圆圈放在底部和右侧，如下所示：

$menu-btn: 65px;

.portfolio-container {
    width: 100%;
    height: 100%;

    .show-menu-btn {
        display: flex;
        justify-content: center;
        align-items: center;
        height: $menu-btn;
        width: $menu-btn;
        border-radius: 50%;
        background-color: #24344b;
        position: sticky;
        bottom: 10;
        right: 10;

        .fa-align-justify {
            color: white;
        }
    }
}

但正如您所见，它不起作用。我究竟做错了什么？

html代码为：

<div class="portfolio-container">
    <div class="show-menu-btn">
      <i class="fas fa-align-justify fa-2x" />
    </div>
  </div>

Answer 1

我发现这有两个问题，首先，您需要说明bottom 和right 是否使用px, em, rem 等：

bottom: 10px;
right: 10px;

其次，你应该将你的位置改为absolute而不是sticky