| <head> | |
| <style> | |
| body { | |
| -webkit-user-select: none; | |
| } | |
| body > select { | |
| padding: 10px; | |
| margin: 20px; | |
| display: inline-block; | |
| border: 1px solid lightgray; | |
| -webkit-box-sizing: border-box; | |
| vertical-align: top; | |
| color: rgb(220, 220, 220); | |
| background-color: rgb(113, 141, 147); | |
| font-family: Verdana, sans-serif; | |
| font-size: 12px; | |
| -webkit-user-select: text; | |
| width: 125px; | |
| height: 100px; | |
| } | |
| option[selected] { | |
| background-color: rgb(130, 170, 170); | |
| color: rgb(235, 235, 235); | |
| } | |
| ::-webkit-scrollbar { | |
| width: 13px; | |
| height: 13px; | |
| } | |
| ::-webkit-scrollbar-corner { | |
| background-image: url(resources/corner.png); | |
| background-repeat: no-repeat; | |
| } | |
| ::-webkit-scrollbar-corner:window-inactive { | |
| background-image: url(resources/corner-inactive.png); | |
| } | |
| ::-webkit-resizer { | |
| background-image: url(resources/resizer.png); | |
| background-repeat: no-repeat; | |
| background-position: bottom right; | |
| } | |
| ::-webkit-resizer:window-inactive { | |
| background-image: url(resources/resizer-inactive.png); | |
| } | |
| ::-webkit-scrollbar-track-piece:disabled { | |
| display: none !important; | |
| } | |
| ::-webkit-scrollbar-button:disabled { | |
| display: none !important; | |
| } | |
| ::-webkit-scrollbar-track:disabled { | |
| margin: 6px; | |
| } | |
| /* Horizontal Scrollbar Styles */ | |
| ::-webkit-scrollbar:horizontal { | |
| -webkit-border-image: url(resources/horizontal-button.png) 0 2 0 2; | |
| border-color: transparent; | |
| border-width: 0 2px; | |
| background-image: url(resources/horizontal-button-background.png); | |
| background-repeat: repeat-x; | |
| } | |
| ::-webkit-scrollbar:horizontal:corner-present { | |
| border-right-width: 0; | |
| } | |
| ::-webkit-scrollbar-track:horizontal:disabled:corner-present { | |
| margin-right: 5px; | |
| } | |
| ::-webkit-scrollbar:horizontal:window-inactive { | |
| -webkit-border-image: url(resources/horizontal-button-inactive.png) 0 2 0 2; | |
| background-image: url(resources/horizontal-button-background-inactive.png); | |
| } | |
| ::-webkit-scrollbar-thumb:horizontal { | |
| -webkit-border-image: url(resources/horizontal-thumb.png) 0 13 0 13; | |
| border-color: transparent; | |
| border-width: 0 13px; | |
| min-width: 20px; | |
| } | |
| ::-webkit-scrollbar-thumb:horizontal:hover { | |
| -webkit-border-image: url(resources/horizontal-thumb-hover.png) 0 13 0 13; | |
| } | |
| ::-webkit-scrollbar-thumb:horizontal:active { | |
| -webkit-border-image: url(resources/horizontal-thumb-active.png) 0 13 0 13; | |
| } | |
| ::-webkit-scrollbar-thumb:horizontal:window-inactive { | |
| -webkit-border-image: url(resources/horizontal-thumb-inactive.png) 0 13 0 13; | |
| } | |
| ::-webkit-scrollbar-track-piece:horizontal:start:no-button, | |
| .double-end::-webkit-scrollbar-track-piece:horizontal:start, | |
| .none::-webkit-scrollbar-track-piece:horizontal:start { | |
| margin-left: 6px; | |
| } | |
| ::-webkit-scrollbar-track-piece:horizontal:end:no-button, | |
| .double-start::-webkit-scrollbar-track-piece:horizontal:end, | |
| .none::-webkit-scrollbar-track-piece:horizontal:end { | |
| margin-right: 6px; | |
| } | |
| ::-webkit-scrollbar-track-piece:horizontal:end:no-button:corner-present, | |
| .double-start::-webkit-scrollbar-track-piece:horizontal:end:corner-present, | |
| .none::-webkit-scrollbar-track-piece:horizontal:end:corner-present { | |
| margin-right: 5px; | |
| } | |
| :not(.none):not(.double-end)::-webkit-scrollbar-track-piece:horizontal:start:single-button, | |
| :not(.none):not(.double-end)::-webkit-scrollbar-track-piece:horizontal:start:double-button, | |
| .single::-webkit-scrollbar-track-piece:horizontal:start, | |
| .double-start::-webkit-scrollbar-track-piece:horizontal:start, | |
| .double-both::-webkit-scrollbar-track-piece:horizontal:start { | |
| margin-left: -6px; | |
| } | |
| :not(.none):not(.double-start)::-webkit-scrollbar-track-piece:horizontal:end:single-button, | |
| :not(.none):not(.double-start)::-webkit-scrollbar-track-piece:horizontal:end:double-button, | |
| .single::-webkit-scrollbar-track-piece:horizontal:end, | |
| .double-end::-webkit-scrollbar-track-piece:horizontal:end, | |
| .double-both::-webkit-scrollbar-track-piece:horizontal:end { | |
| margin-right: -6px; | |
| } | |
| ::-webkit-scrollbar-track:horizontal:disabled { | |
| -webkit-border-image: url(resources/horizontal-track-disabled.png) 0 13 0 13; | |
| border-color: transparent; | |
| border-width: 0 13px; | |
| } | |
| ::-webkit-scrollbar-track-piece:horizontal:decrement { | |
| -webkit-border-image: url(resources/horizontal-track.png) 0 13 0 13; | |
| border-color: transparent; | |
| border-width: 0 0 0 13px; | |
| } | |
| ::-webkit-scrollbar-track-piece:horizontal:decrement:hover { | |
| -webkit-border-image: url(resources/horizontal-track-hover.png) 0 13 0 13; | |
| } | |
| ::-webkit-scrollbar-track-piece:horizontal:decrement:active { | |
| -webkit-border-image: url(resources/horizontal-track-active.png) 0 13 0 13; | |
| } | |
| ::-webkit-scrollbar-track-piece:horizontal:increment { | |
| -webkit-border-image: url(resources/horizontal-track.png) 0 13 0 13; | |
| border-color: transparent; | |
| border-width: 0 13px 0 0; | |
| } | |
| ::-webkit-scrollbar-track-piece:horizontal:increment:hover { | |
| -webkit-border-image: url(resources/horizontal-track-hover.png) 0 13 0 13; | |
| } | |
| ::-webkit-scrollbar-track-piece:horizontal:increment:active { | |
| -webkit-border-image: url(resources/horizontal-track-active.png) 0 13 0 13; | |
| } | |
| ::-webkit-scrollbar-button:horizontal { | |
| width: 20px; | |
| -webkit-border-image: url(resources/horizontal-button.png) 0 2 0 2; | |
| border-color: transparent; | |
| border-width: 0 2px; | |
| } | |
| ::-webkit-scrollbar-button:horizontal:decrement { | |
| background-image: url(resources/horizontal-decrement-arrow.png), url(resources/horizontal-button-background.png); | |
| background-repeat: no-repeat, repeat-x; | |
| background-position: 2px 3px, 0 0; | |
| } | |
| ::-webkit-scrollbar-button:horizontal:decrement:hover { | |
| -webkit-border-image: url(resources/horizontal-button-hover.png) 0 2 0 2; | |
| background-image: url(resources/horizontal-decrement-arrow.png), url(resources/horizontal-button-background-hover.png); | |
| } | |
| ::-webkit-scrollbar-button:horizontal:decrement:active { | |
| -webkit-border-image: url(resources/horizontal-button-active.png) 0 2 0 2; | |
| background-image: url(resources/horizontal-decrement-arrow.png), url(resources/horizontal-button-background-active.png); | |
| } | |
| ::-webkit-scrollbar-button:horizontal:decrement:window-inactive { | |
| -webkit-border-image: url(resources/horizontal-button-inactive.png) 0 2 0 2; | |
| background-image: url(resources/horizontal-decrement-arrow.png), url(resources/horizontal-button-background-inactive.png); | |
| } | |
| ::-webkit-scrollbar-button:horizontal:increment { | |
| background-image: url(resources/horizontal-increment-arrow.png), url(resources/horizontal-button-background.png); | |
| background-repeat: no-repeat, repeat-x; | |
| background-position: 7px 3px, 0 0; | |
| } | |
| ::-webkit-scrollbar-button:horizontal:increment:hover { | |
| -webkit-border-image: url(resources/horizontal-button-hover.png) 0 2 0 2; | |
| background-image: url(resources/horizontal-increment-arrow.png), url(resources/horizontal-button-background-hover.png); | |
| } | |
| ::-webkit-scrollbar-button:horizontal:increment:active { | |
| -webkit-border-image: url(resources/horizontal-button-active.png) 0 2 0 2; | |
| background-image: url(resources/horizontal-increment-arrow.png), url(resources/horizontal-button-background-active.png); | |
| } | |
| ::-webkit-scrollbar-button:horizontal:increment:window-inactive { | |
| -webkit-border-image: url(resources/horizontal-button-inactive.png) 0 2 0 2; | |
| background-image: url(resources/horizontal-increment-arrow.png), url(resources/horizontal-button-background-inactive.png); | |
| } | |
| :not(.single)::-webkit-scrollbar-button:double-button:horizontal:start:decrement, | |
| .double-start::-webkit-scrollbar-button:horizontal:start:decrement, | |
| .double-both::-webkit-scrollbar-button:horizontal:start:decrement { | |
| width: 14px; | |
| border-right-width: 0; | |
| background-position: 2px 3px, 0 0; | |
| } | |
| :not(.single)::-webkit-scrollbar-button:double-button:horizontal:start:increment, | |
| .double-start::-webkit-scrollbar-button:horizontal:start:increment, | |
| .double-both::-webkit-scrollbar-button:horizontal:start:increment { | |
| background-position: 3px 3px, 0 0; | |
| } | |
| :not(.single)::-webkit-scrollbar-button:double-button:horizontal:end:decrement, | |
| .double-end::-webkit-scrollbar-button:horizontal:end:decrement, | |
| .double-both::-webkit-scrollbar-button:horizontal:end:decrement { | |
| background-position: 7px 3px, 0 0; | |
| } | |
| :not(.single)::-webkit-scrollbar-button:double-button:horizontal:end:increment, | |
| .double-end::-webkit-scrollbar-button:horizontal:end:increment, | |
| .double-both::-webkit-scrollbar-button:horizontal:end:increment { | |
| width: 14px; | |
| border-left-width: 0; | |
| background-position: 3px 3px, 0 0; | |
| } | |
| ::-webkit-scrollbar-button:horizontal:end:increment:corner-present { | |
| border-right-width: 0; | |
| width: 19px; | |
| } | |
| :not(.single)::-webkit-scrollbar-button:double-button:horizontal:end:increment:corner-present, | |
| .double-end::-webkit-scrollbar-button:horizontal:end:increment:corner-present, | |
| .double-both::-webkit-scrollbar-button:horizontal:end:increment:corner-present { | |
| width: 13px; | |
| } | |
| /* Vertical Scrollbar Styles */ | |
| ::-webkit-scrollbar:vertical { | |
| -webkit-border-image: url(resources/vertical-button.png) 2 0 2 0; | |
| border-color: transparent; | |
| border-width: 2px 0; | |
| background-image: url(resources/vertical-button-background.png); | |
| background-repeat: repeat-y; | |
| } | |
| ::-webkit-scrollbar:vertical:corner-present { | |
| border-bottom-width: 0; | |
| } | |
| ::-webkit-scrollbar-track:vertical:disabled:corner-present { | |
| margin-bottom: 5px; | |
| } | |
| ::-webkit-scrollbar:vertical:window-inactive { | |
| -webkit-border-image: url(resources/vertical-button-inactive.png) 2 0 2 0; | |
| background-image: url(resources/vertical-button-background-inactive.png); | |
| } | |
| ::-webkit-scrollbar-thumb:vertical { | |
| -webkit-border-image: url(resources/vertical-thumb.png) 13 0 13 0; | |
| border-color: transparent; | |
| border-width: 13px 0; | |
| min-height: 20px; | |
| } | |
| ::-webkit-scrollbar-thumb:vertical:hover { | |
| -webkit-border-image: url(resources/vertical-thumb-hover.png) 13 0 13 0; | |
| } | |
| ::-webkit-scrollbar-thumb:vertical:active { | |
| -webkit-border-image: url(resources/vertical-thumb-active.png) 13 0 13 0; | |
| } | |
| ::-webkit-scrollbar-thumb:vertical:window-inactive { | |
| -webkit-border-image: url(resources/vertical-thumb-inactive.png) 13 0 13 0; | |
| } | |
| ::-webkit-scrollbar-track-piece:vertical:start:no-button, | |
| .double-end::-webkit-scrollbar-track-piece:vertical:start, | |
| .none::-webkit-scrollbar-track-piece:vertical:start { | |
| margin-top: 6px; | |
| } | |
| ::-webkit-scrollbar-track-piece:vertical:end:no-button, | |
| .double-start::-webkit-scrollbar-track-piece:vertical:end, | |
| .none::-webkit-scrollbar-track-piece:vertical:end { | |
| margin-bottom: 6px; | |
| } | |
| ::-webkit-scrollbar-track-piece:vertical:end:no-button:corner-present, | |
| .double-start::-webkit-scrollbar-track-piece:vertical:end:corner-present, | |
| .none::-webkit-scrollbar-track-piece:vertical:end:corner-present { | |
| margin-bottom: 5px; | |
| } | |
| :not(.none):not(.double-end)::-webkit-scrollbar-track-piece:vertical:start:single-button, | |
| :not(.none):not(.double-end)::-webkit-scrollbar-track-piece:vertical:start:double-button, | |
| .single::-webkit-scrollbar-track-piece:vertical:start, | |
| .double-start::-webkit-scrollbar-track-piece:vertical:start, | |
| .double-both::-webkit-scrollbar-track-piece:vertical:start { | |
| margin-top: -6px; | |
| } | |
| :not(.none):not(.double-start)::-webkit-scrollbar-track-piece:vertical:end:single-button, | |
| :not(.none):not(.double-start)::-webkit-scrollbar-track-piece:vertical:end:double-button, | |
| .single::-webkit-scrollbar-track-piece:vertical:end, | |
| .double-end::-webkit-scrollbar-track-piece:vertical:end, | |
| .double-both::-webkit-scrollbar-track-piece:vertical:end { | |
| margin-bottom: -6px; | |
| } | |
| ::-webkit-scrollbar-track:vertical:disabled { | |
| -webkit-border-image: url(resources/vertical-track-disabled.png) 13 0 13 0; | |
| border-color: transparent; | |
| border-width: 13px 0; | |
| } | |
| ::-webkit-scrollbar-track-piece:vertical:decrement { | |
| -webkit-border-image: url(resources/vertical-track.png) 13 0 13 0; | |
| border-color: transparent; | |
| border-width: 13px 0 0 0; | |
| } | |
| ::-webkit-scrollbar-track-piece:vertical:decrement:hover { | |
| -webkit-border-image: url(resources/vertical-track-hover.png) 13 0 13 0; | |
| } | |
| ::-webkit-scrollbar-track-piece:vertical:decrement:active { | |
| -webkit-border-image: url(resources/vertical-track-active.png) 13 0 13 0; | |
| } | |
| ::-webkit-scrollbar-track-piece:vertical:increment { | |
| -webkit-border-image: url(resources/vertical-track.png) 13 0 13 0; | |
| border-color: transparent; | |
| border-width: 0 0 13px 0; | |
| } | |
| ::-webkit-scrollbar-track-piece:vertical:increment:hover { | |
| -webkit-border-image: url(resources/vertical-track-hover.png) 13 0 13 0; | |
| } | |
| ::-webkit-scrollbar-track-piece:vertical:increment:active { | |
| -webkit-border-image: url(resources/vertical-track-active.png) 13 0 13 0; | |
| } | |
| ::-webkit-scrollbar-button:vertical { | |
| height: 20px; | |
| -webkit-border-image: url(resources/vertical-button.png) 2 0 2 0; | |
| border-color: transparent; | |
| border-width: 2px 0; | |
| } | |
| ::-webkit-scrollbar-button:vertical:decrement { | |
| background-image: url(resources/vertical-decrement-arrow.png), url(resources/vertical-button-background.png); | |
| background-repeat: no-repeat, repeat-y; | |
| background-position: 3px 3px, 0 0; | |
| } | |
| ::-webkit-scrollbar-button:vertical:decrement:hover { | |
| -webkit-border-image: url(resources/vertical-button-hover.png) 2 0 2 0; | |
| background-image: url(resources/vertical-decrement-arrow.png), url(resources/vertical-button-background-hover.png); | |
| } | |
| ::-webkit-scrollbar-button:vertical:decrement:active { | |
| -webkit-border-image: url(resources/vertical-button-active.png) 2 0 2 0; | |
| background-image: url(resources/vertical-decrement-arrow.png), url(resources/vertical-button-background-active.png); | |
| } | |
| ::-webkit-scrollbar-button:vertical:decrement:window-inactive { | |
| -webkit-border-image: url(resources/vertical-button-inactive.png) 2 0 2 0; | |
| background-image: url(resources/vertical-decrement-arrow.png), url(resources/vertical-button-background-inactive.png); | |
| } | |
| ::-webkit-scrollbar-button:vertical:increment { | |
| background-image: url(resources/vertical-increment-arrow.png), url(resources/vertical-button-background.png); | |
| background-repeat: no-repeat, repeat-y; | |
| background-position: 3px 8px, 0 0; | |
| } | |
| ::-webkit-scrollbar-button:vertical:increment:hover { | |
| -webkit-border-image: url(resources/vertical-button-hover.png) 2 0 2 0; | |
| background-image: url(resources/vertical-increment-arrow.png), url(resources/vertical-button-background-hover.png); | |
| } | |
| ::-webkit-scrollbar-button:vertical:increment:active { | |
| -webkit-border-image: url(resources/vertical-button-active.png) 2 0 2 0; | |
| background-image: url(resources/vertical-increment-arrow.png), url(resources/vertical-button-background-active.png); | |
| } | |
| ::-webkit-scrollbar-button:vertical:increment:window-inactive { | |
| -webkit-border-image: url(resources/vertical-button-inactive.png) 2 0 2 0; | |
| background-image: url(resources/vertical-increment-arrow.png), url(resources/vertical-button-background-inactive.png); | |
| } | |
| :not(.single)::-webkit-scrollbar-button:double-button:vertical:start:decrement, | |
| .double-start::-webkit-scrollbar-button:vertical:start:decrement, | |
| .double-both::-webkit-scrollbar-button:vertical:start:decrement { | |
| height: 14px; | |
| border-bottom-width: 0; | |
| background-position: 3px 3px, 0 0; | |
| } | |
| :not(.single)::-webkit-scrollbar-button:double-button:vertical:start:increment, | |
| .double-start::-webkit-scrollbar-button:vertical:start:increment, | |
| .double-both::-webkit-scrollbar-button:vertical:start:increment { | |
| background-position: 3px 4px, 0 0; | |
| } | |
| :not(.single)::-webkit-scrollbar-button:double-button:vertical:end:decrement, | |
| .double-end::-webkit-scrollbar-button:vertical:end:decrement, | |
| .double-both::-webkit-scrollbar-button:vertical:end:decrement { | |
| background-position: 3px 8px, 0 0; | |
| } | |
| :not(.single)::-webkit-scrollbar-button:double-button:vertical:end:increment, | |
| .double-end::-webkit-scrollbar-button:vertical:end:increment, | |
| .double-both::-webkit-scrollbar-button:vertical:end:increment { | |
| height: 14px; | |
| border-top-width: 0; | |
| background-position: 3px 4px, 0 0; | |
| } | |
| ::-webkit-scrollbar-button:vertical:end:increment:corner-present { | |
| border-bottom-width: 0; | |
| height: 19px; | |
| } | |
| :not(.single)::-webkit-scrollbar-button:double-button:vertical:end:increment:corner-present, | |
| .double-end::-webkit-scrollbar-button:vertical:end:increment:corner-present, | |
| .double-both::-webkit-scrollbar-button:vertical:end:increment:corner-present { | |
| height: 13px; | |
| } | |
| /* Forced Scrollbar Mode Styles */ | |
| .single::-webkit-scrollbar-button:start:decrement, | |
| .single::-webkit-scrollbar-button:end:increment { | |
| display: block; | |
| } | |
| .single::-webkit-scrollbar-button:start:increment, | |
| .single::-webkit-scrollbar-button:end:decrement { | |
| display: none; | |
| } | |
| .double-end::-webkit-scrollbar-button:start { | |
| display: none; | |
| } | |
| .double-end::-webkit-scrollbar-button:end { | |
| display: block; | |
| } | |
| .double-start::-webkit-scrollbar-button:start { | |
| display: block; | |
| } | |
| .double-start::-webkit-scrollbar-button:end { | |
| display: none; | |
| } | |
| .double-both::-webkit-scrollbar-button { | |
| display: block; | |
| } | |
| .none::-webkit-scrollbar-button { | |
| display: none; | |
| } | |
| </style> | |
| <script> | |
| /* Preload the scrollbar images to prevent flickering when changing states. */ | |
| (new Image()).src = "resources/corner-inactive.png"; | |
| (new Image()).src = "resources/corner.png"; | |
| (new Image()).src = "resources/horizontal-button-active.png"; | |
| (new Image()).src = "resources/horizontal-button-background-active.png"; | |
| (new Image()).src = "resources/horizontal-button-background-hover.png"; | |
| (new Image()).src = "resources/horizontal-button-background-inactive.png"; | |
| (new Image()).src = "resources/horizontal-button-background.png"; | |
| (new Image()).src = "resources/horizontal-button-hover.png"; | |
| (new Image()).src = "resources/horizontal-button-inactive.png"; | |
| (new Image()).src = "resources/horizontal-button.png"; | |
| (new Image()).src = "resources/horizontal-decrement-arrow.png"; | |
| (new Image()).src = "resources/horizontal-increment-arrow.png"; | |
| (new Image()).src = "resources/horizontal-thumb-active.png"; | |
| (new Image()).src = "resources/horizontal-thumb-hover.png"; | |
| (new Image()).src = "resources/horizontal-thumb-inactive.png"; | |
| (new Image()).src = "resources/horizontal-thumb.png"; | |
| (new Image()).src = "resources/horizontal-track-active.png"; | |
| (new Image()).src = "resources/horizontal-track-disabled.png"; | |
| (new Image()).src = "resources/horizontal-track-hover.png"; | |
| (new Image()).src = "resources/horizontal-track.png"; | |
| (new Image()).src = "resources/resizer-inactive.png"; | |
| (new Image()).src = "resources/resizer.png"; | |
| (new Image()).src = "resources/vertical-button-active.png"; | |
| (new Image()).src = "resources/vertical-button-background-active.png"; | |
| (new Image()).src = "resources/vertical-button-background-hover.png"; | |
| (new Image()).src = "resources/vertical-button-background-inactive.png"; | |
| (new Image()).src = "resources/vertical-button-background.png"; | |
| (new Image()).src = "resources/vertical-button-hover.png"; | |
| (new Image()).src = "resources/vertical-button-inactive.png"; | |
| (new Image()).src = "resources/vertical-button.png"; | |
| (new Image()).src = "resources/vertical-decrement-arrow.png"; | |
| (new Image()).src = "resources/vertical-increment-arrow.png"; | |
| (new Image()).src = "resources/vertical-thumb-active.png"; | |
| (new Image()).src = "resources/vertical-thumb-hover.png"; | |
| (new Image()).src = "resources/vertical-thumb-inactive.png"; | |
| (new Image()).src = "resources/vertical-thumb.png"; | |
| (new Image()).src = "resources/vertical-track-active.png"; | |
| (new Image()).src = "resources/vertical-track-disabled.png"; | |
| (new Image()).src = "resources/vertical-track-hover.png"; | |
| (new Image()).src = "resources/vertical-track.png"; | |
| </script> | |
| </head> | |
| <body> | |
| <select size=4 > | |
| <option>One | |
| <option>Two | |
| <option>Three | |
| <option>Four | |
| <option>Five | |
| </select> | |
| <select size=4 class="single"> | |
| <option>One | |
| <option>Two | |
| <option>Three | |
| <option>Four | |
| <option>Five | |
| </select> | |
| <select size=4 class="double-end"> | |
| <option>One | |
| <option>Two | |
| <option>Three | |
| <option>Four | |
| <option>Five | |
| </select> | |
| <select size=4 class="double-start"> | |
| <option>One | |
| <option>Two | |
| <option>Three | |
| <option>Four | |
| <option>Five | |
| </select> | |
| <select size=4 class="double-both"> | |
| <option>One | |
| <option>Two | |
| <option>Three | |
| <option>Four | |
| <option>Five | |
| </select> | |
| <select size=4 class="none"> | |
| <option>One | |
| <option>Two | |
| <option>Three | |
| <option>Four | |
| <option>Five | |
| </select> | |
| <select size=4> | |
| <option>One | |
| <option>Two | |
| </select> |