Dear lazyweb: CSS question
This is something that I want to do for quite some time, but I haven't figure it out how.
If I have a HTML table styled with width: 80%
but the total size of the content on each <td>
is smaller than the 80% size, then the browser will try to make all the columns the same width, and add extra spaces at the right side of the cell.
What I wanted is to specify that some columns should shrink to the smallest possible size without causing line breaks in the content.
For example in an invoice with 4 fields, item description, quantity, value and sub-total, the default layout would be something like this:
| item | 10 | 100 | 1000 |
and I wanted this:
| item | 10 | 100 | 1000 |
I wonder if there is some CSS combination that does this, that I can apply to a <colgroup>
to say "give me the minimal possible width for these columns.
Any tips?