252 lines
5.5 KiB
HTML
252 lines
5.5 KiB
HTML
<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> |