[thelist] Absolute positioned element inside a <td> that has overflow:hidden
Bill Moseley
moseley at hank.org
Mon Aug 16 14:51:57 CDT 2010
On Mon, Aug 16, 2010 at 12:13 PM, Frank Marion <lists at frankmarion.com>wrote:
>
> You have random cells that may or may not display strings that might exceed
> the side of a td. You want to create a sort of disclosure div, so that if
> the user sees "this is some really long text and to [more]". When they hover
> or click, it expands the div so that they can see the rest of the data. Sort
> of a tool-tips deal.
>
Close. Replace the "this has a popup" text in the <td> with something the
browser won't wrap.
"xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx"
So, in that case I added overflow: hidden on the <td>, but in all but IE
that prevented the popup absolute positioned box from displaying outside the
<td>.
So, the solution seems be
<td overflow:visible position:relative>
<div overflow:hidden>table cell text that might be
toooooooooooooooooooooooooooooooooooo long</div>
<div position:absolute>popup box</div>
</td>
*IF* that's the case, and you can use js, is there some reason you don't use
> overflow as an on-off switch, as seems to be the natural behaviour right
> now?
>
You mean toggle the overflow with js? No, the purpose of the box is not to
display the potentially overflowing text.
--
Bill Moseley
moseley at hank.org
More information about the thelist
mailing list