CODEWITHSUNDEEP
javascriptcsshtml
stack man
stack man

Reputation: 2413

Can't make text-area resizable to fit windows size

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?

Thanks a lot.

Upvotes: 4

Views: 1881

Answers (2)

Joshua
Joshua

Reputation: 822

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.

.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.

Upvotes: 3

aaronk6
aaronk6

Reputation: 2811

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

Try this:

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

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

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

Upvotes: 3

Related Questions