Firefox ignores absolute positioning in table cells

html css firefox css-position
Variant picture Variant · Jan 9, 2012 · Viewed 10.7k times · Source

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?

Answer

banners picture banners · Jan 9, 2012

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

Related questions

Problem with absolute positioning in Firefox and Chrome

I don't understand why FF and Chrome render my page differently. Here's a screenie of it in firefox: firefox example http://grab.by/65Bn and here's one in chrome chrome: chrome example http://grab.by/65BB fieldset has a relative …

Read More
Hide scroll bar, but while still being able to scroll

I want to be able to scroll through the whole page, but without the scrollbar being shown. In Google Chrome it's: ::-webkit-scrollbar { display: none; } But Mozilla Firefox and Internet Explorer don't seem to work like that. I also tried this …

Read More
How to remove the arrow from a select element in Firefox

I'm trying to style a select element using CSS3. I'm getting the results I desire in WebKit (Chrome / Safari), but Firefox isn't playing nicely (I'm not even bothering with IE). I'm using the CSS3 appearance property, but for some reason …

Read More