Make <td> as wide as possible

Question

I am working on a system like CMS and will list the content in tables. The problem is that due to the fact that the tables work by default, information about the right hand (date created, views, etc.) takes up more space than necessary and looks good ... stupid. So I wonder if anyone knows how to get the <td> header to use as much space as possible and therefore push the contents of the right hand to the edge.

Answer 1

Set the width to 100%

 <td width="100%"> 

it's a bit hacky but works

Edit: to prevent other columns from crossing, I use this in OTHER columns:

 <td class="no-wrap"> 

and style sheet

 <style> .no-wrap { white-space: nowrap; } </style> 

Answer 2

Your CSS might look like this:

 .tblX { width: 100%; min-width:480px; max-width:960px} .col1 { width: 10%; min-width:48px; max-width:96px} .col2 { width: 70%; min-width:336px; max-width:672px} .col3 { width: 20%; min-width:96px; min-width:192px} 

And your HTML looks like this:

 <table class="tblX"> <tr> <td class="col1">some text</td> <td class="col2">some text</td> <td class="col3">some text</td> </tr> </table> 

You can change the proportions of the width of the columns of the table. Here comes the fiddle: http://jsfiddle.net/PVfAW/

Answer 3

I would suggest using percentages and creating a css rule to "maximum" with these external td. see here CSS3 examples for verbal packaging, word interruption. http://www.css3.com/css-word-wrap/