How to make TD behave like TR (string) using CSS?

Question

I have a component that dynamically creates an HTML table. According to my needs, I need to show td tags line by line as a block element, not as a column. How to do it using CSS?

Answer 1

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

http://jsfiddle.net/wYA9K/

This works in all modern browsers except IE9 ..

Using float: left; width: 100% float: left; width: 100% , it also works in IE8 / 9 instead:

http://jsfiddle.net/gvpzh/

Nothing will make it work in IE7.

Answer 2

Try this :

 td{ display: table-row } 

Answer 3

You can use the display: block css property as shown in this fiddle

Answer 4

I am not sure if this is your pending decision.

Please check this: http://jsfiddle.net/thilakar/mPdd7/2/

Answer 5

you can use colspan attribute

 <tr> <td colspan="2">some content</td> </tr> 

this will make a cell that spans two columns