Table with cells left aligned and extra space on the right - html

Question

I would like to have the cells of my table left aligned but at the same time autofit.
Example:
thead td {
background-color: yellow;
}
td {
border:1px solid #000;
}
<br/>
<p>
First table
</p>
<br/>
<table style="width: 100%;">
<thead>
<tr>
<td>Title 1</td>
<td>Title 2</td>
<td>Title 3</td>
</tr>
</thead>
<tr>
<td class="block">First column with some additional text (blah blah blah blah blah)</td>
<td class="block">Second column</td>
<td class="block">Third column</td>
</tr>
</table>
<br/>
<p>
Second table
</p>
<br/>
<table style="width: 100%;">
<thead>
<tr>
<td>Title 1</td>
<td>Title 2</td>
<td>Title 3</td>
</tr>
</thead>
<tr>
<td class="block">First column</td>
<td class="block">Second column</td>
<td class="block">Third column</td>
</tr>
</table>
on the second table we clearly see that each cells are equal width.
This is not what I wanted.
I want to have each cells side by side without extra space between.
Extra space should be on the right.
Edit: an image of what I want:

Answer 1

Edit: if you don't want multilines in column use
white-space:nowrap; in `td` css
use :nth-last-child in your CSS to make it 100% in width
thead td {
background-color: yellow;
}
td {
border:1px solid #000;
}
thead td:nth-last-child(1){
width:100%;
}
<table style="width: 100%;">
<thead>
<tr>
<td>Title 1</td>
<td>Title 2</td>
<td>Title 3</td>
</tr>
</thead>
<tr>
<td class="block">First column </td>
<td class="block">Second column</td>
<td class="block">Third column</td>
</tr>
</table>

Answer 2

try it help full
thead td {
background-color: yellow;
}
td {
border:1px solid #000;
}
thead td:last-child{
width:100%;
}
<br/>
<p>
First table
</p>
<br/>
<table style="width: 100%;">
<thead>
<tr>
<td>Title 1</td>
<td>Title 2</td>
<td>Title 3</td>
</tr>
</thead>
<tr>
<td class="block">First column with some additional text (blah blah blah blah blah)</td>
<td class="block">Second column</td>
<td class="block">Third column</td>
</tr>
</table>
<br/>
<p>
Second table
</p>
<br/>
<table style="width: 100%;">
<thead>
<tr>
<td>Title 1</td>
<td>Title 2</td>
<td>Title 3</td>
</tr>
</thead>
<tr>
<td class="block">First column</td>
<td class="block">Second column</td>
<td class="block">Third column</td>
</tr>
</table>
i have add some css
thead td:last-child{
width:100%;
}

Answer 3

Do you mean something like that?
<table style="width: 100%;">
<thead>
<tr>
<td style="width: 150px;">Title 1</td>
<td style="width: 150px;">Title 2</td>
<td>Title 3</td>
</tr>
</thead>
<tr>
<td class="block">First column</td>
<td class="block">Second column</td>
<td class="block">Third column</td>
</tr>
</table>