0c45f0c9059f7185a131297116000aef5eea6418
[ikiwiki.git] / doc / todo / edit_form:_no_fixed_size_for_textarea.mdwn
1 At the moment the text area in the edit form has a fixed size of 20 rows.
2
3 On longer pages its not very comfortable to edit pages with such a small box. The whole screen size should be used instead([example](http://img3.imagebanana.com/img/bl10u9mb/editingtodo_1241804460828.png)).
4
5 > The whole screen width is used, via the following
6 > from style.css:
7 >
8 >       {
9 >        width: 100%;
10 >       }
11 >
12 > Perhaps you have replaced it with a modified style sheet that does not
13 > include that? --[[Joey]]
14
15 >> The screen shot was made with http://ikiwiki.info/ where i didn't change anything. The width is optimally used. The problem is the height.
16
17 >>> You confused me by talking about rows...  
18 >>> I don't know how to allow CSS to resize a textarea
19 >>> to the full browser height. The obvious `height: 75%;`
20 >>> does not work, at least in firefox and epiphany.
21 >>> 
22 >>> Ah, of course, if it did work, it'd make it be 75% of
23 >>> the full *page* height, and not the browser window height.
24 >>>
25 >>> According to
26 >>> [this page](http://stackoverflow.com/questions/632983/css-height-if-textarea-as-a-percentage-of-the-viewport-height):
27 >>>>>50% of what? Parent says ‘auto’, which means base it on the height of the child content. Which depends on the height on the parent. Argh! etc.
28 >>>>>
29 >>>>>So you have to give its parent a percentage height. And the parent's parent, all the way up to the root.
30 >>> So, other than a javascript-based resizer, some very tricky and invasive CSS
31 >>> seems to be needed. Please someone let me know if you succeed in doing that.
32 >>> --[[Joey]] 
33
34 >>>>>> the javascript approach would need to work something like this: you need to know about the "bottom-most" item on the edit page, and get a handle for that object in the DOM. You can then obtain the absolute position height-wise of this element and the absolute position of the bottom of the window to determine the pixel-difference. Then, you set the height of the textarea to (current height in px) + determined-value. This needs to be re-triggered on various resize events, at least for the window and probably for other elements too. I may have a stab at this at some point. -- [[Jon]]
35
36 Google chrome has a completly elegant fix for this problem: All textareas
37 have a small resize handle in a corner, that can be dragged around. No
38 nasty javascript needed. IMHO, this is the right solution, and I hope other
39 browsers emulate it. [[done]]
40 --[[Joey]]