Display:table-cell not working in IE9?
css
Solution
I found the answer from an old thread, where @thirtydot wrote
I applied float: left to stuff. It kinda works.
How can I make "display: block" work on a <td> in IE?
As he said, it kinda works... IE9 stops rendering stuff all crazy, but there's still som aligning to do to make it look good. But that answer is good enough, I can fix the rest myself...
Problem
I've got a table where I'm using the CSS display property to alter the layout. For full size browsers I use "block" and for smaller ones I use "table-cell". It works great in Firefox, Safari and Chrome, but somehow IE9 seems to mess it up of course... When I debug the page using Firebug and the likes, it's clear that all browsers except IE change the display:table-cell to display:block. But IE is stuck with display:block even though the CSS file clearly states it should be table-cell. Is there any known issues with "table-cell" in IE9 or any known work arounds? EDIT: The issue is not with table-cell, it's with Display:block on a table cell. The problem I'm having can be found here: http://css-tricks.com/examples/ResponsiveTables/responsive.php Open in Chrome/Firefox and resize browser window - the table is responsive and changes to a narrow design. Open in IE9 and resize - the table is static and does not change. EDIT2: In the previous example the responsive part is commented out for IE, because the creator knew that it would be messy. Nevertheless, I want to be able to create this kind of design that works in IE as well, so I need to make some kind of workaround for it to make it work. Here is a JSFiddle that shows how IE9 messes up the responsive table when reponsive part is included: http://jsfiddle.net/2Mt37/