Question

Possible Duplicate:
Does Firefox support position: relative on table elements?

Does Firefox ignore relative positioning on table cells?

I am trying to nest an absolute positioned element inside a relatively positioned table cell but Firefox is ignoring the relative positioning on the table cell and the absolutely positioned element is positioned according to the browser window.

HTML:

<table><tbody><tr><td><span></span></td></tr></tbody></table>​

CSS:

table{
    width:500px;
    height:50px;
}
td {
    position:relative;
    width:50%;
}
span {
    position:absolute;
    right:0;
    display:block;
    background:#333;
    width:20px;
    height:20px;
}

Here’s an example on jsfiddle.

The proper formatting of this would be to have the span be positioned approximately at the horizontal center of the result window, but Firefox would position it all the way to the right of the window. Any workaround for this while the element remains absolutely positioned and no static numbers for the right/left/margin properties… Thanks.

Answer 1

Add

position: relative;

To your table…

table{
    position: relative;
    width:500px;
    height:50px;
}

Here’s an example