Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Firefox ignores absolute positioning in table cells

I am trying to absolutely position an element inside a table cell. The TD has position:relative and the element has position:absolute.

This works great in all browsers except in Firefox where it is positioned relative to an ancestor relative container.

You can see this reproduced in this fiddle: http://jsfiddle.net/ac5CR/1/

Does anyone know if I miss some CSS setting that can fix that in Firefox?

like image 972
Variant Avatar asked Jan 09 '12 14:01

Variant


People also ask

What positioning puts the text fixed in the browser?

The fixed positioning property helps to put the text fixed on the browser. This fixed test is positioned relative to the browser window, and doesn't move even you scroll the window.

How would you absolutely positioned element?

An absolutely positioned element is an element whose computed position value is absolute or fixed . The top , right , bottom , and left properties specify offsets from the edges of the element's containing block. (The containing block is the ancestor relative to which the element is positioned.)

How do I fix text position in HTML?

To set text alignment in HTML, use the style attribute. The style attribute specifies an inline style for an element. The attribute is used with the HTML <p> tag, with the CSS property text-align for the center, left and right alignment.

What type of position is positioning elements only by browser window?

Fixed positioning is really just a specialized form of absolute positioning; elements with fixed positioning are fixed relative to the viewport/browser window rather than the containing element; even if the page is scrolled, they stay in exactly the same position inside the browser window.


1 Answers

the element is not a block element. add to the style display:block, you will get the needed behavior.

like image 99
banners Avatar answered Sep 21 '22 13:09

banners