third_party/WebKit/LayoutTests/fast/forms/basic-textareas-quirks.html

   1 <html><head><style>
   2 div {
   3   border:1px solid red;
   4   width:350px;
   5   font-size:14px;
   6   line-height:14px;
   7 }
   8 .wrapper-div {
   9   float:left;
  10 }
  11 </style></head>
  12 <body>
  13
  14 <div class='wrapper-div'>
  15 Plain textarea with little content
  16 <div>
  17 A
  18 <textarea>Lorem ipsum dolor</textarea>
  19 B
  20 </div>
  21
  22 Plain textarea
  23 <div>
  24 A
  25 <textarea>Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
  26 B
  27 </div>
  28
  29 Disabled textarea
  30 <div>
  31 A
  32 <textarea DISABLED>Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
  33 B
  34 </div>
  35
  36 style="padding:10px"
  37 <div>
  38 A
  39 <textarea style="padding:10px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
  40 B
  41 </div>
  42
  43 style="padding:0px"
  44 <div>
  45 A
  46 <textarea style="padding:0px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
  47 B
  48 </div>
  49
  50 style="margin:10px"
  51 <div>
  52 A
  53 <textarea style="margin:10px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
  54 B
  55 </div>
  56
  57 style="margin:0px"
  58 <div>
  59 A
  60 <textarea style="margin:0px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
  61 B
  62 </div>
  63
  64 cols=3
  65 <div>
  66 A
  67 <textarea cols=3>Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
  68 B
  69 </div>
  70
  71 rows=3
  72 <div>
  73 A
  74 <textarea rows=3>Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
  75 B
  76 </div>
  77
  78 cols=10
  79 <div>
  80 A
  81 <textarea cols=10>Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
  82 B
  83 </div>
  84
  85 rows=10
  86 <div>
  87 A
  88 <textarea rows=10>Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
  89 B
  90 </div>
  91
  92 cols=5 rows=4
  93 <div>
  94 A
  95 <textarea cols=5 rows=4>Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
  96 B
  97 </div>
  98
  99 </div>
 100 <div class='wrapper-div'>
 101
 102 style="width:60px"
 103 <div>
 104 A
 105 <textarea style="width:60px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
 106 B
 107 </div>
 108
 109 style="width:60px;padding:20px"
 110 <div>
 111 A
 112 <textarea style="width:60px;padding:20px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
 113 B
 114 </div>
 115
 116 style="width:60px;padding:0"
 117 <div>
 118 A
 119 <textarea style="width:60px;padding:0">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
 120 B
 121 </div>
 122
 123 style="height:60px"
 124 <div>
 125 A
 126 <textarea style="height:60px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
 127 B
 128 </div>
 129
 130 style="width:60px;height:60px"
 131 <div>
 132 A
 133 <textarea style="width:60px;height:60px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
 134 B
 135 </div>
 136
 137 style="overflow:hidden"
 138 <div>
 139 A
 140 <textarea style="overflow:hidden">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
 141 B
 142 </div>
 143
 144 style="overflow:scroll"
 145 <div>
 146 A
 147 <textarea style="overflow:scroll">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
 148 B
 149 </div>
 150
 151 style="overflow:hidden;width:60px;height:60px"
 152 <div>
 153 A
 154 <textarea style="overflow:hidden;width:60px;height:60px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
 155 B
 156 </div>
 157
 158 style="overflow:scroll;width:60px;height:60px"
 159 <div>
 160 A
 161 <textarea style="overflow:scroll;width:60px;height:60px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
 162 B
 163 </div>
 164
 165 cols=5 style="width:60px;height:60px"
 166 <div>
 167 A
 168 <textarea cols=5 style="width:60px;height:60px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
 169 B
 170 </div>
 171
 172 rows=4 style="width:60px;height:60px"
 173 <div>
 174 A
 175 <textarea rows=4 style="width:60px;height:60px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
 176 B
 177 </div>
 178
 179 cols=5 rows=4 style="width:60px;height:60px"
 180 <div>
 181 A
 182 <textarea cols=5 rows=4 style="width:60px;height:60px">Lorem ipsum dolor ABCDEFGHIJKLMNOPQRSTUVWXYZ abcdefghijklmnopqrstuv </textarea>
 183 B
 184 </div>
 185
 186 wrap="off"
 187 <div>
 188 A
 189 <textarea wrap="off">
 190 This is a text area with wrap="soft"
 191 This is a text area with wrap="soft"
 192 This is a text area with wrap="soft"
 193 This is a text area with wrap="soft"
 194 This is a text area with wrap="soft"
 195 This is a text area with wrap="soft"
 196 This is a text area with wrap="soft"
 197 This is a text area with wrap="soft"
 198 This is a text area with wrap="soft"
 199 This is a text area with wrap="soft"
 200 This is a text area with wrap="soft"
 201 This is a text area with wrap="soft"
 202 This is a text area with wrap="soft"
 203 This is a text area with wrap="soft"
 204 </textarea>
 205 B
 206 </div>
 207
 208 wrap="hard"
 209 <div>
 210 A
 211 <textarea wrap="hard">
 212 This is a text area with wrap="soft"
 213 This is a text area with wrap="soft"
 214 This is a text area with wrap="soft"
 215 This is a text area with wrap="soft"
 216 This is a text area with wrap="soft"
 217 This is a text area with wrap="soft"
 218 This is a text area with wrap="soft"
 219 This is a text area with wrap="soft"
 220 This is a text area with wrap="soft"
 221 This is a text area with wrap="soft"
 222 This is a text area with wrap="soft"
 223 This is a text area with wrap="soft"
 224 This is a text area with wrap="soft"
 225 This is a text area with wrap="soft"
 226 </textarea>
 227 B
 228 </div>
 229
 230 wrap="soft"
 231 <div>
 232 A
 233 <textarea wrap="soft">
 234 This is a text area with wrap="soft"
 235 This is a text area with wrap="soft"
 236 This is a text area with wrap="soft"
 237 This is a text area with wrap="soft"
 238 This is a text area with wrap="soft"
 239 This is a text area with wrap="soft"
 240 This is a text area with wrap="soft"
 241 This is a text area with wrap="soft"
 242 This is a text area with wrap="soft"
 243 This is a text area with wrap="soft"
 244 This is a text area with wrap="soft"
 245 This is a text area with wrap="soft"
 246 This is a text area with wrap="soft"
 247 This is a text area with wrap="soft"
 248 </textarea>
 249 B
 250 </div>
 251 </div>
 252 </body></html>