- From: <bugzilla@jessica.w3.org>
- Date: Sat, 05 Mar 2011 04:32:47 +0000
- To: public-html-bugzilla@w3.org
http://www.w3.org/Bugs/Public/show_bug.cgi?id=12245 Summary: @size on <select> drop-downs is not enough to specify the drop-down maxlength on long options lists with scrollbars Product: HTML WG Version: unspecified Platform: PC OS/Version: All Status: NEW Severity: normal Priority: P2 Component: HTML5 spec (editor: Ian Hickson) AssignedTo: ian@hixie.ch ReportedBy: silviapfeiffer1@gmail.com QAContact: public-html-bugzilla@w3.org CC: mike@w3.org, public-html-wg-issue-tracking@w3.org, public-html@w3.org This is trying to solve the problem discussed here: http://stackoverflow.com/questions/570642/height-of-an-html-select-box-dropdown I am trying to implement a drop-down box that behaves the same across all browsers. We have the <select> tag for this purpose. I add the lines for the drop-down into the <options>. I have a large number of options - say 50 (e.g. a list of languages). My screen space is not big, because the drop-down is e.g. at the bottom of a page, an overlay on a video, or in an iframe. So, I would like limit the number of visible options in the drop-down to e.g. 10 elements, while at the same time continuing to keep this a drop-down list. However, every browser chooses by default a different drop-down list length after which the drop-down starts to have a scrollbar: Firefox has 20 items, Opera & Webkit as many as fit on the visible page etc (the stackoverflow link above lists more). So, you would think that the @size attribute on <select> solves this problem. For example: <html> <body> <select size=10> <option>Volvo</option> <option>Saab</option> <option>Mercedes</option> <option>Audi</option> <option>Volvo</option> <option>Saab</option> <option>Mercedes</option> <option>Audi</option> <option>Volvo</option> <option>Saab</option> <option>Mercedes</option> <option>Audi</option> <option>Volvo</option> <option>Saab</option> <option>Mercedes</option> <option>Audi</option> <option>Volvo</option> <option>Saab</option> <option>Mercedes</option> <option>Audi</option> <option>Volvo</option> <option>Saab</option> <option>Mercedes</option> <option>Audi</option> <option>Volvo</option> <option>Saab</option> <option>Mercedes</option> <option>Audi</option> <option>Volvo</option> <option>Saab</option> <option>Mercedes</option> <option>Audi</option> <option>Volvo</option> <option>Saab</option> <option>Mercedes</option> <option>Audi</option> </select> </body> </html> You can try the example e.g. by entering it here: http://www.w3schools.com/TAGS/tryit.asp?filename=tryhtml_option As you can see, the @size attribute does not do what I need. Instead, it turns the drop-down into a list and removes the drop-down functionality. The only solution to this problem is to create your own drop-down in JavaScript. I don't think it should be this hard! There is a lack of specification in the <select> element. One way to solve this is to introduce a attribute that specifies the display style of the element to be either "list" or "drop-down". Then, for drop-down, the @size attribute is interpreted to mean the number of displayed options and the overflow CSS style could define what to do in cases of overflow (or we just leave it at scroll). -- Configure bugmail: http://www.w3.org/Bugs/Public/userprefs.cgi?tab=email ------- You are receiving this mail because: ------- You are the QA contact for the bug.
Received on Saturday, 5 March 2011 04:32:49 UTC