View Full Version : CSS clashes with iframe

07-31-2006, 12:49 PM
I have installed a number of the different CSS or javascript drop down menus from dd on my website (... only one at a time, of course!). But when I open something like an excel spreadsheet or powerpoint inside my webpage (using an iframe or something like that), the drop down menu is hidden underneath the content whenever a sub-menu "drops down".

Regardless of what my z-index may be, the powerpoint, spreadsheet, or explorer window being displayed in the iframe is always on top of the menu items. Can someone help me solve this and get the menu to always be on top of anything loaded in the iframe?

The iframe and CSS menu play together nicely as long as the iframe has HTML content in it (ie - the CSS menu is on top of the iframe). However, as soon as non-HTML content (such as a windows directory, an excel file, or a power point file) are loaded in the iframe, then the CSS menu is hidden underneath the iframe.

07-31-2006, 04:29 PM
If you are you "position:absolute" with put you menu code below the iframe (i'm not positive this will work)

<div>Menu header</div>
<iframe src="whatever">
<div style="position:absulute...">
Menu here

Not sure, though, if this will work.

07-31-2006, 04:34 PM
Unfortunately, there's not really a way around this. Of course, you shouldn't really be relying on non-web content being displayed by a plugin anyway...