bug 119 - no title for options or select in IE6

Issue: #119
Affects: IE6
Note: Updated synopsis to include the select element, not just the options.

Have you ever wanted to provide more descriptive text in the form of a tooltip in your Web applications? Of course you have. It may have slipped your notice though, that this doesn't work on select list options (or even the select list itself) in IE6 (fixed in IE7).

Example:

<select size="3">
  <option value="1" title="Web Bug Track">WBT</option>
  <option value="2" title="Bugzilla Bug Tracking">Bugzilla</option>
  <option value="3" title="Tracker Bug Track">Tracker</option>
</select>

WBT
Bugzilla
Tracker

Known Workarounds: None.

Related Issues: (bug 291) (bug 280).

Bug/Site Feedback |
Submit a bug

bug 280 - lack of events for options

Issue: #280
Affects: IE5, IE5.5, IE6, IE7, IE8 Beta 1, Opera, Safari, ?

The option element is used inside a select element to provide options for the user to select from. Like all visually displayed elements in the browser, you can attach event handlers to them too.

Well, not quite. The following table indicates the level of support for each browser, and event.

Event	Firefox	Internet Explorer	Konqueror	Opera	Safari
onclick	Yes	No	?	Yes	No
onmouseover	Yes	No	?	No (v9.5 Yes!)	No
onmouseout	Yes	No	?	No (v9.5 Yes!)	No
keyup	No	No	?	No	No
keydown	No	No	?	No	No
keypress	No	No	?	No	No

Only Firefox seems to support the full array of mouse events, Opera is next supporting an onclick event, but in IE and Safari(win) there is no support for mouse events on options.

Oddly enough, no browser seems to support keyboard events on options.

View the following samples in Firefox, Safari or Opera and IE.

Example:


Samples
Red (click)
Blue (mouseover)
Green (mouseout)
No events here
Or here
Orange (keydown)
Yellow (keyup)
Aqua (keypress)

Known Workarounds: None.

Related Issues: bug 291.

bug 293 - can't disable options in IE

Issue: #293
Affects: IE5, IE5.5, IE6, IE7, IE8 Beta 1

MSIE Feedback ID: 336685

Yet another issue with select lists in IE. First you couldn't style them (bug 291) then it turns out, you can't disable them either!

Example:

<select>
  <option>I am valid</option>
  <option>I am valid too</option>
  <option disabled="disabled">I am NOT valid</option>
  <option>I am also valid</option>
</select>

Try it for yourself, load this page up in IE and any other browser.

I am valid
I am valid too
I am NOT valid
I am also valid

Known Workarounds: None.

Related Issues: bug 291.

bug 291 - no styling options in IE and only some in Safari

Issue: #291
Affects: IE5, IE5.5, IE6, IE7, IE8 Beta 1, Safari

CSS was meant to be the solution to applying global styling, without interfering with the content of a page. For the most part, it works really well, although IE has been very slow to catch up to the other major browsers in this arena.

Case in point. The option element is used inside a select element to provide options for the user to select from. In IE, you can style it any way you want, as long as all you want to style is the font and the color... because all other styling options just won't work!

View the following samples in Firefox, Safari or Opera and they will work like a charm*. In IE the colors work, but after that, it just ignore the styling requests.

Example:

Red
Blue
Green
Lots of padding
Background Image


Note: In Safari (on the Mac), the background colors do work, but the background images do not.

Known Workarounds: None.

Related Issues: None.