CSS - Stop resizeable element from going beyond window size

I have just notice, if you have element on the page that is resizeable (e.g. textarea)

When you resize it:

• it will allow you to resize as big as browser windows (inluding scroll bar)
• which ends up which putting resizeable corerner behind the scroll
• meaning you cannot size it down anymore

Please note that: The windows is HTML element (some more HTML content inside). It does have a width value changing dynamically.

Please see the screens:

Screen before resize

Screen after resize:

Is there any CSS fix for th开发者_开发百科is??

---

Not specifically to keep it from being larger than the window, but you can set max-width in the CSS to keep it from being expanded beyond a reasonably size.

---

There are max-width and max-height properties in CSS. You might try to set a value like 90%, which will — I guess — limit the sizes of your text area to 90% of the container.

If this isn't what you want, you might try to specify abolute values for it, eg: 800px for the width.

---

You can use CSS to disable the resizing

> textarea {
>        resize: none;  
         }

or

<textarea name="" value="" style="resize:none;"/>