Go sha wrote: > ... Please let me know (and > forgive me) if I break any of the lists' rules...
Hello Sharon. It is more likely to get help when you offer an URL to a valid testcase. > I have a list that displays information of certain items. ... I > had to absolutely position elements within the list. This required to relatively position the list item. And for IE, you had to add a height to the li to allow for bottom-positioning. > To save space, a tooltip was required from within the list. But (I > think) because the other list item (boxes) below are relatively > positionned, the tooltip shows up _under_ the subsequent items, only > in IE! The problem in IE is, that any dimensioned element with a position:relative establishes a new stacking context. This is wrong, and it is still wrong in IE7. You can simulate this wrong behavior in the good browsers by adding a z-index:1 to the first relatively positioned list item and z-index:2 to the second. The stacking context is the basis for any stacking operation within this block. The tooltip pops up under the second block, because nothing inside this stacking context 1 will ever escape to render above block 2, no matter what z-index you apply to a positioned child. I do not see an elegant solution. I think you'll have to apply a higher z-index:2 to the first block and z-index:1 to the second, which should be no big problem for generated content. An alternative is to omit the position:relative and rethink the positioning inside the list entry. Or, you could dimension the tooltip as a rectangle in landscape format and position the tooltip with a more negative x-offset. > <li> > <div class="list-item"> <li class="list-item"> > <div class="header"><h2> </h2></div> <h2 class="header"> ... and so forth. ><div class="song_inplaylist"> ><a href="#"> >In playlist ><div> It is not allowed to have a div inside a link. Use a span with display:block. <a href="#" class="song_inplaylist">In playlist<span> .... </span></a> You should validate your code. The web developer toolbar extension for Fx comfortably sends a page to the W3C validator. Ingo -- http://www.satzansatz.de/css.html ______________________________________________________________________ css-discuss [EMAIL PROTECTED] http://www.css-discuss.org/mailman/listinfo/css-d IE7b2 testing hub -- http://css-discuss.incutio.com/?page=IE7 List wiki/FAQ -- http://css-discuss.incutio.com/ Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
