select-sizing-001-ref.html (1312B)
1 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="utf-8"> 5 <title>Reference for sizing of select elements, with wide vs. empty option selected</title> 6 <link rel="author" title="Daniel Holbert" href="mailto:dholbert@mozilla.com"> 7 <style> 8 select { 9 color: transparent; 10 margin: 1px; 11 } 12 div.customBorder > select { 13 /* This class is to let us test select elements *without* native theming 14 (for browsers that have both native and non-native controls): */ 15 border: 3px solid black; 16 } 17 </style> 18 </head> 19 <body> 20 <div> 21 <select> 22 <option>some wide option</option> 23 </select> 24 <br> 25 <select> 26 <option>some wide option</option> 27 </select> 28 <br> 29 <select> 30 <option>some wide option</option> 31 </select> 32 <br> 33 <select> 34 <option>some wide option</option> 35 </select> 36 </div> 37 38 <!-- This is the same as above, but now with a custom border on the 39 select elements: --> 40 <div class="customBorder"> 41 <select> 42 <option>some wide option</option> 43 </select> 44 <br> 45 <select> 46 <option>some wide option</option> 47 </select> 48 <br> 49 <select> 50 <option>some wide option</option> 51 </select> 52 <br> 53 <select> 54 <option>some wide option</option> 55 </select> 56 </div> 57 58 </body> 59 </html>