third_party/WebKit/ManualTests/select-webkit-appearance-off-narrow-select.html

   1 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
   2 <head>
   3     <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
   4     <title>Padding on select with webkit-appearance: off</title>
   5     <style type="text/css">
   6         #webkit-appearance-none {
   7             -webkit-appearance: none;
   8             border: 1px solid black;
   9             width: 15px;
  10             padding-left: 5px;
  11             padding-right: 5px;
  12         }
  13
  14         #narrow-with-border {
  15             border: 1px solid black;
  16             width: 40px;
  17         }
  18     </style>
  19 </head>
  20
  21 <body>
  22     <p>This is a manual test for <a href="https://bugs.webkit.org/show_bug.cgi?id=33235">Padding in popup
  23     menu gets lost with styled select in Windows</a></p>
  24     <p>To open the selects, click inside the select boxes below.</p>
  25
  26     <p>The options in this selects should have padding on both the left and the right, the edges of
  27     the text should not be pressed against the edges of the opened select.</p>
  28     <select id="webkit-appearance-none">
  29         <option href="#">Do Action ABCDEFG</option>
  30         <option href="#">Do Action ABCDEFG</option>
  31         <option href="#">Do Action ABCDEFG</option>
  32         <option href="#">Do Action ABCDEFG</option>
  33         <hr />
  34         <option href="#">Do Action ABCDEFG</option>
  35         <option href="#">Do Action ABCDEFG</option>
  36     </select>
  37
  38     <p>The options in this select should not have too much padding on the right</p>
  39     <select id="narrow-with-border">
  40         <option href="#">Do Action ABCDEFG</option>
  41         <option href="#">Do Action ABCDEFG</option>
  42         <option href="#">Do Action ABCDEFG</option>
  43         <option href="#">Do Action ABCDEFG</option>
  44         <hr />
  45         <option href="#">Do Action ABCDEFG</option>
  46         <option href="#">Do Action ABCDEFG</option>
  47     </select>
  48 </body>
  49 </html>