0

I think I'm going to tear my hair out if I don't figure this out.

http://www.keystoneelderlaw.com/

If you highlight over Resources in IE 8, the dropdown box is cut-off. Normally this would be caused by an overflow: hidden property or something in higher up in the tree. But in this case, I don't understand what in the world is causing it. Any help?

I set the height on to 500px to make sure that wasn't impacting the problem. I'm at a loss.

Update: I solved the problem myself after hours of hair-pulling. Its a problem with IE Propietary filters. Read my own answer further down the page and you'll find a link to the issue in detail.

JamesHoux
  • 2,999
  • 3
  • 32
  • 50

3 Answers3

2

RESOLVED:

Evidentally, Internet Explorer propietary filters cause divs to act like they have "Overflow: hidden;" set even if you try to explicitly set them to "overflow: visible;".

I had a "filter:" gradient set the div and that was causing the problem. But its also been stated that alpha/opacity filters can cause the same behavior. The problem is described in detail with a hack here:

How do I stop internet explorer's propriety gradient filter from cutting off content that should overflow?

I ended up just removing the filter completely and letting IE visitors not see a gradient. I hate hacks. They're not worth it.

Community
  • 1
  • 1
JamesHoux
  • 2,999
  • 3
  • 32
  • 50
1

In your css add property to #slide

#slide
{
 z-index:-999
}
Shakeel
  • 11
  • 1
0

it looks like your dropdown menu is being rendered behind your carousel, look into z-index and see if this can solve your problem (give the dropdown div's css a higher z-index that the carousel) http://www.w3schools.com/cssref/pr_pos_z-index.asp

mr_lewjam
  • 1,180
  • 1
  • 9
  • 20
  • Thanks to both of you but, no that's not the problem. If you look closely the dropdown is being cut off at the edge of the menu 1st level UL. Its not even making it down to the carousel. I added z-index: -999 as directed to teh slider just to verify that's not the problem. In fact, I even set #header {display: none;} to completely remove the box below the menu and the carousel with it out of the DOM. It has no impact on the menu problem. If the problem was this simple, I could have solved it myself. I'm stumped. – JamesHoux Oct 17 '12 at 20:24