CSS多按钮无法正确定位

Question

我无法在 CSS 中获得两个按钮的正确定位。

下图详细说明了我想要的结果，但我需要有关相对于上面文本区域的定位的帮助。

我尝试过使用绝对、相对和弹性盒定位，但我是新手，不知道如何让它完全按照我的需要工作。

Answer 1

这是你想要的吗？

.comment-area {
  width: min-content;
}

.button-area {
  display: flex;
  gap: 4px;
}

.button-area > * {
  flex: 1;
}

<div class="comment-area">
  <textarea></textarea>
  <div class="button-area">
    <button>Clear</button>
    <button>Submit</button>
  </div>
</div>