title: Hover Dropdown Menu Z-Index Issue in IE7
body: <p>I am working on a page for one of our applications that displays a large table of data as well as a dropdown with options to perform on each item. You can see a dumbed-down version of my project at (link removed, issue is resolved).</p>
  
  <p>Here is my issue: The dropdown menu on each row is positioned absolutely, and each has a z-index of 600. On hover I increase the z-index to 900 so that when it opens it can appear on top of the dropdown in the row directly below it. I suspect this hover state isn't taking effect in IE7, and the dropdown is always appearing underneath the dropdown in the next row (only in IE7).</p>
  
  <p>Next I tried giving the dropdown in the 1st row a z-index of 699, the dropdown in the 2nd row a z-index of 698, the 3rd row 697, etc, so that each would be higher than the one below it. This also does not work, and when opened the dropdowns still appear underneath the next row's dropdown.</p>
  
  <p>I understand that by giving the parent element a higher z-index you can fix IE7 z-index issues, and I actually did use this method for another menu on the same page (but it isn't in this demo page) and it worked fine for that purpose. However, I've tried giving the parent of these dropdowns a z-index of 999 (with position: relative, of course) and still I have no luck getting the correct stacking order on the page. This is driving me crazy, and I really need to get this project finished, and this is the only thing that isn't working properly before we can launch. Really hate supporting IE7, but it has to be done, and I know this has to be possible. Please, I would really appreciate any help anybody can offer me. I feel like I've exhausted every possibility, but hopefully somebody knows how this can be accomplished.</p>