How to deal with translucent SELECT in IE

Problem

Standard select , once under the opaque diva, remains completely visible in IE. Because of this, its features, drop-down menus, pop-up windows, and other items related to the positioning of divs can look extremely messy.

Solutions
')
There are several ways to solve this problem. I will list them from simple to complex:

1. hide select
2. iframe over select 'a
3. own select 's



Read more

1. hide select
The simplest solution is to set selects (all or intersecting with divas) css property visibility: hidden;
Of course, you need to look for all selects and do not need to set each of them. It is enough to define the css class:
.noselect select { visibility: hidden; }

and add this class to the area over which will be div.
Display style display: none; in this case it does not fit - the page layout can “crawl”.

2. iframe over select 'a
Perhaps the most interesting solution. For a completely incomprehensible reason for me, selections in IE do not “make their way” through the iframe .
Those. if you first place an iframe and a div on top of it, the selections will behave like in all decent browsers.
Unfortunately, this solution is not suitable for translucent divs. (UPD: thank you beartamer and vithar )

3. own select 's
No selektov - no problem. Those. Instead of selects, you can use their imitation.
There are ready-made scripts that "on the fly" replace all selects with their counterpart based on pop-up divas. Of course, our problem will be solved.
However, there are a couple of comments. First, not all scripts provide full functionality when imitating selects. Secondly, selects will have a non-standard look, and this is not always beneficial.

If you know other recipes - I will be very grateful for them.

original LJ