Chiều rộng ô phù hợp với nội dung

Question

Với đánh dấu sau, làm cách nào để sử dụng CSS để buộc một ô (tất cả các ô trong cột) vừa với chiều rộng của nội dung trong đó thay vì kéo dài (đó là hành vi mặc định)?

<style type="text/css"> 
td.block 
{ 
border: 1px solid black; 
} 
</style> 
<table style="width: 100%;"> 
<tr> 
    <td class="block">this should stretch</td> 
    <td class="block">this should stretch</td> 
    <td class="block">this should be the content width</td> 
</tr> 
</table> 

EDIT: Tôi nhận ra rằng tôi có thể mã hóa chiều rộng, nhưng tôi không muốn làm điều đó vì nội dung sẽ đi vào cột đó là động.

Nhìn vào hình ảnh bên dưới, hình ảnh đầu tiên là những gì đánh dấu sản xuất. Hình ảnh thứ hai là những gì tôi muốn.

Answer 1

Tôi không chắc chắn nếu tôi hiểu câu hỏi của bạn, nhưng tôi sẽ mất một đâm vào nó. JSfiddle of the example.

HTML:

<table style="width: 100%;"> 
<tr> 
    <td class="block">this should stretch</td> 
    <td class="block">this should stretch</td> 
    <td class="block">this should be the content width</td> 
</tr> 
</table> 

CSS:

td{ 
    border:1px solid #000; 
} 

tr td:last-child{ 
    width:1%; 
    white-space:nowrap; 
}