无法使文本区域可调整大小以适合窗口大小

Question

我正在尝试使用此代码调整文本区域的大小：

<div class="fields" style="resize:both;">
  <div class="text-area-display-panel" style="resize:both;">
    ...contents...
  </div>
</div>

然而，它不起作用，我找不到原因（它应该那么简单，对吧？）。此外，是否有任何CSS属性或类似的东西使窗口始终适合窗口大小？

非常感谢。

Answer 1

resize设置为overflow时，visible属性无效（这是默认值）。

试试这个：

<div class="text-area-display-panel" style="resize:both; overflow: hidden;">

详细信息：https://developer.mozilla.org/en-US/docs/Web/CSS/resize

示例：https://developer.mozilla.org/samples/cssref/resize.html

Answer 2

如果你想让html元素始终适合窗口大小，最好的方法之一是在css中，将其宽度和高度设置为100％。确保你有百分号。

.text-area-display-panel {
    width:100%;
    height:100%;
}

问题可能是你没有为div分配颜色，所以你看不到它。如果是这样，那么只需添加背景颜色属性。