Question

我有一个灰色的父div容器，在其中创建了一个可扩展的文本输入框，如下所示：

如果要扩展输入框，我想动态设置父div（灰色的一个）的高度。但是，它只是隐藏在灰色div容器下面。查看附件图片

我尝试为父div设置overflow:auto, max-height属性，但似乎没有任何效果。这是我的代码段。

<div classname={styles.greybox}>
    <div classname={styles.input}>
        <InputAreaText />
    </div>
</div>

这是我父级的CSS。

.greybox {
  overflow:auto;
  height: 58%;
  max-height: 800px;
  overflow-x: hidden;
  position: sticky;
}

    .input{
  display: grid;
  grid-template: repeat(2, 50px) / 75% 25%;
  column-gap: 2%;
  width: auto;
  height: auto;
  padding-bottom: 0.5rem;
}

Answer 1

<div style="background:grey; padding:5px">

  <textarea rows="10"></textarea>

</div>

希望这可以解决您的问题

如何根据内容动态设置父div的高度？

1 个答案: