不能调整文本区域大小以适应windows大小

时间:2020-12-11 21:10:17

I am trying to make a text-area resizable with this code:

我正在尝试用以下代码调整文本区域的大小:

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

However, it's not working, and I can't find out why (it should be that simple, right?). Besides, is there any CSS property or similar to make the window always fit the window size?

然而,它不起作用,我也不知道为什么(应该这么简单,对吧?)此外,是否有CSS属性或类似的属性使窗口始终适合窗口大小?

Thanks a lot.

非常感谢。

2 个解决方案

#1


3  

The resize property has no effect when overflow is set to visible (which is the default value).

当将溢出设置为可见(这是默认值)时,resize属性没有效果。

Try this:

试试这个:

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

Details: https://developer.mozilla.org/en-US/docs/Web/CSS/resize

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

Example: https://developer.mozilla.org/samples/cssref/resize.html

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

#2


3  

If you want an html element to always fit the window size one of the best ways to do it is in the css, put its width and height to 100%. Make sure you have the percent sign.

如果您希望html元素始终适合窗口大小,最好的方法之一是在css中,将其宽度和高度设置为100%。一定要有百分号。

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

Also the problem might be you do not have a color assigned to the div so you can not see it. If so then just add a background-color property.

另外,问题可能是您没有为div分配颜色,所以您看不到它。如果是,那么只需添加一个背景颜色属性。

#1


3  

The resize property has no effect when overflow is set to visible (which is the default value).

当将溢出设置为可见(这是默认值)时,resize属性没有效果。

Try this:

试试这个:

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

Details: https://developer.mozilla.org/en-US/docs/Web/CSS/resize

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

Example: https://developer.mozilla.org/samples/cssref/resize.html

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

#2


3  

If you want an html element to always fit the window size one of the best ways to do it is in the css, put its width and height to 100%. Make sure you have the percent sign.

如果您希望html元素始终适合窗口大小,最好的方法之一是在css中,将其宽度和高度设置为100%。一定要有百分号。

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

Also the problem might be you do not have a color assigned to the div so you can not see it. If so then just add a background-color property.

另外,问题可能是您没有为div分配颜色,所以您看不到它。如果是,那么只需添加一个背景颜色属性。