Make cell fill availble space with its text, but not add whitespaces - html

Question

Conclusion: use JavaScript to calculate max-width of first cell.
Example:
<table>
<tr>
<td style="white-space:nowrap; overflow: hidden">Some text. It maybe very long and should be shortened if there is no more available width in table</td>
<td>This shall always be visible and should not have any space between this and the previous cell, but if the two cells are thinner than the table I want my white-spaces after the end of this cell</td>
</tr>
</table>
What I don't know is the width of cell2 or the width of the table
What I want to achieve is to have a max-width on the first cell, based on available space without using JavaScript. Not sure if it even is possible.
Example where the text is short:
|Some short text|Her comes a new text |
Example where the text is too long:
|This is some text which might s|Her comes a new text|

Answer 1

Its a little hard to determine exactly what you want- perhaps something like this?
HTML
<div>
<span>Something quite long that should exceed the table cell.</span>
<span>here is some moreSomething quite long that should exceed the table cell.Something quite long that should exceed the table cell.</span>
</div>
CSS
div{
margin:0;
padding:0;
display:table;
table-layout: fixed;
width:100%;
max-width:100%;
}
span{
padding 0 20;
margin:0;
display:table-cell;
border:1px solid grey;
}
span:first-child{
white-space: nowrap;
overflow:hidden;
text-overflow: ellipsis;
}
span:last-child{
width:auto;
}

Answer 2

You can use the selector :first-child to select the first <td> inside a table:
table td:first-child {
width: 100%;
}

Answer 3

Is this what you want?
All I did was add a max-width to the cell that you want a max width on.
td:first-child {
max-width: 100px;
overflow: hidden;
white-space: nowrap;
}

Answer 4

Simplest solution without JavaScript is:
<table>
<tr>
<td style="width:80%;">Some text. It maybe very long and should be shortened if there is no more available width in table</td>
<td>This shall always be visible and should not have any space between this and the previous cell, but if the two cells are thinner than the table I want my white-spaces after the end of this cell</td>
</tr>
</table>
Apologies, if I do not understand what exactly you want!