[thelist] Absolute positioned element inside a <td> that has overflow:hidden

[Bill Moseley]

I want a table where I set width of columns (or table) and long text inside
of a cell is hidden (i.e. overflow: hidden).

Now, I also want to have a "popup" on some cells that is positioned absolute
(out of the flow) but relative to the <td> where it is contained.  (I'll
have a "click to expand") to show details about data in a cell, for example.

The problem I have when the <td> has overflow: hidden then the absolute
positioned element is hidden.  Here's a demo:

http://hank.org/overflow.html

In IE it works as I would like -- the yellow box is absolutely positioned
above the relative <td> and shown in full.  On Firefox/Safari/Chrome the
yellow box is clipped due to the overflow: hidden.

If I want that cell to have overflow:hidden but the popup to be visible is
the only choice to wrap the text like this?

 <td overflow:visible>
    <div style="overflow:hidden">cell text</div>
    <div class="popup">...</div>
</td>


Thanks,


-- 
Bill Moseley
moseley at hank.org