javascript - IE7 z-index wrong order -


check jsfiddle.

in ie7 code in jsfiddle above displays dropdown (.sboptions) under next selectbox element (.sbholder).

.sboptions has z-index: 100; still displayed under .sbholder.

this works fine in browsers except ie7, idea how solve this?

there error in ie7: without setting z-index , long haslayout set true, stacking context assigned positioned element. width , height of .sbholder such haslayout triggers. therefore, second .sbholder @ top.

ie7 changes rule to:

.sbholder {     position: relative;     width: 130px;     height: 30px;     display: block;     margin-bottom: 20px;     z-index: 0; /* ! */ } 

this ruins plan increase .sboptions z-index since .sboptions catched irregular stacking context of .sbholder.

i've got solution ie <=7 in 1 .sboptions dropped down @ time. come scratch? let's hope so!

have go: http://jsfiddle.net/hrubx/

the irregular stacking context produced if required:

li:hover {     position: relative; } 

Comments

Popular posts from this blog

java - Jmockit String final length method mocking Issue -

asp.net - Razor Page Hosted on IIS 6 Fails Every Morning -

c++ - wxwidget compiling on windows command prompt -