| <html><head><style> |
| div { |
| border:1px solid red; |
| width:350px; |
| font-size:14px; |
| line-height:14px; |
| } |
| .wrapper-div { |
| float:left; |
| } |
| </style></head> |
| <body> |
| |
| <div class='wrapper-div'> |
| Plain textarea with little content |
| <div> |
| A |
| <textarea>Lorem ipsum dolor</textarea> |
| B |
| </div> |
| |
| Plain textarea |
| <div> |
| A |
| <textarea>Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| Disabled textarea |
| <div> |
| A |
| <textarea DISABLED>Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| style="padding:10px" |
| <div> |
| A |
| <textarea style="padding:10px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| style="padding:0px" |
| <div> |
| A |
| <textarea style="padding:0px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| style="margin:10px" |
| <div> |
| A |
| <textarea style="margin:10px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| style="margin:0px" |
| <div> |
| A |
| <textarea style="margin:0px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| cols=3 |
| <div> |
| A |
| <textarea cols=3>Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| rows=3 |
| <div> |
| A |
| <textarea rows=3>Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| cols=10 |
| <div> |
| A |
| <textarea cols=10>Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| rows=10 |
| <div> |
| A |
| <textarea rows=10>Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| cols=5 rows=4 |
| <div> |
| A |
| <textarea cols=5 rows=4>Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| </div> |
| <div class='wrapper-div'> |
| |
| style="width:60px" |
| <div> |
| A |
| <textarea style="width:60px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| style="width:60px;padding:20px" |
| <div> |
| A |
| <textarea style="width:60px;padding:20px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| style="width:60px;padding:0" |
| <div> |
| A |
| <textarea style="width:60px;padding:0">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| style="height:60px" |
| <div> |
| A |
| <textarea style="height:60px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| style="width:60px;height:60px" |
| <div> |
| A |
| <textarea style="width:60px;height:60px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| style="overflow:hidden" |
| <div> |
| A |
| <textarea style="overflow:hidden">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| style="overflow:scroll" |
| <div> |
| A |
| <textarea style="overflow:scroll">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| style="overflow:hidden;width:60px;height:60px" |
| <div> |
| A |
| <textarea style="overflow:hidden;width:60px;height:60px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| style="overflow:scroll;width:60px;height:60px" |
| <div> |
| A |
| <textarea style="overflow:scroll;width:60px;height:60px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| cols=5 style="width:60px;height:60px" |
| <div> |
| A |
| <textarea cols=5 style="width:60px;height:60px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| rows=4 style="width:60px;height:60px" |
| <div> |
| A |
| <textarea rows=4 style="width:60px;height:60px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| cols=5 rows=4 style="width:60px;height:60px" |
| <div> |
| A |
| <textarea cols=5 rows=4 style="width:60px;height:60px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea> |
| B |
| </div> |
| |
| wrap="off" |
| <div> |
| A |
| <textarea wrap="off"> |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| </textarea> |
| B |
| </div> |
| |
| wrap="hard" |
| <div> |
| A |
| <textarea wrap="hard"> |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| </textarea> |
| B |
| </div> |
| |
| wrap="soft" |
| <div> |
| A |
| <textarea wrap="soft"> |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| This is a text area with wrap="soft" |
| </textarea> |
| B |
| </div> |
| </div> |
| </body></html> |
