Loading ...
Sorry, an error occurred while loading the content.

Overlay window doesn't appear in IE if it's nested?

Expand Messages
  • fstoflegend
    Hi everyone, first time posting in the YUI group =) I m using YUI s container to create an overlay window. Basically when someone clicks a window, a window
    Message 1 of 1 , Dec 10, 2006
    • 0 Attachment
      Hi everyone,
      first time posting in the YUI group =)

      I'm using YUI's container to create an overlay window. Basically when
      someone clicks a window, a window comes up on top, and shades out
      (disables) everything underneath. This window isn't a browser window,
      it's just the module layer.

      I'm trying to align this to pop out right under the link that shows
      it. IF I do that, Firefox shows it correctly, but in Internet
      Explorer, it's also greyed out, and looks like it's hiddin behind a
      few objects. It is, however, aligned correctly.

      What I've come to realize is, since the div tag is way at the top of
      the page, all my other div layers go over it, so in IE it doesn't come
      to the front.

      I've tried setting the z-index to 1, but that still doesn't work.

      Here is my HTML code (pseudo style):
      <div id="doc2" class="yui-t7">
      <div id="hd">
      <div class="toplayer">
      <div id="settings">
      <div class="hd">
      Settings
      </div>
      <div class="bd">
      Here are your settings.
      </div>
      <div class="ft">
      </div>
      </div>
      </div>
      <a href="#" id="showSettings">Settings</a>
      </div>
      </div>

      Here is my CSS code:

      div .toplayer, div#settings{
      width: 485px;
      height: 485px;
      }

      div#settings{
      position: absolute;
      top: 0;
      right: 0;
      }

      div.toplayer{
      position: absolute;
      top: 1.5em;
      right: 0;
      }

      My Javascript code is a bit complicated, though if you need it to knwo
      what's going on, let me know =)

      THank you guys!
    Your message has been successfully submitted and would be delivered to recipients shortly.