How to make TD behaving like TR(row) with CSS?

css, html, html-table

Solution

You can do this by applying `display: block` to the `td`s:

http://jsfiddle.net/wYA9K/

That works in all modern browsers except IE9..

Using `float: left; width: 100%` instead makes it also work in IE8/9:

http://jsfiddle.net/gvpzh/

Nothing will make it work in IE7.

Problem

I have a component that create dynamically html table. According to my need, I need to show td tags line by line as a block element not like column. How to do that by using CSS ?

Original source