In bug 167951, I am implementing text areas which can be resized, which will look something like the following:
The notch in the corner will allow the box to be resized smaller and larger. This will be available for all HTML <textarea> elements as well as XUL multiline textbox elements. However, for XUL elements, a resizable attribute set to either true or false may be used to enable or disable this feature. The default is false as it is likely that multiline textboxes in dialog boxes won’t have room to be resized anyway.
Adding support for this feature involved adding a number of other XUL features. The first, in bug 510335, adds support to the <stack> element for right and bottom attributes, in addition to supporting left as top as it does currently. This allows alignment of the children of a stack to any of the four sides by specifying a margin. For instance, this example positions a button 10 pixels from the right edge and 5 pixels from the bottom edge.
<stack width="100" height="100"> <button label="Hello" right="10" bottom="5"/> </stack>
You can also specify all four positions, and they then just act like margins from the stack’s edge.
The second feature is extending the <resizer> element in bug 511180 to allow resizing any element. Currently, the <resizer> is always used to resize the window. You can see this kind of resizing notch in use in Firefox in the lower right corner of a window below the scrollbar.
But, by adding an element attribute, you can specify the id of a specific element to resize. Most common, you would use the special value ‘_parent’ which means to resize the parent element. The following pattern might be common:
<stack> <button label="Resizable"/> <resizer dir="bottomend" right="0" bottom="0" element="_parent"/> </stack>
All of these features are works in progress, so note that the specifics may change.