Consider the following code:
<table style="width:100%;table-layout:fixed;font-size: 60px" border=2>
<tr>
<td style="width:70%;overflow:hidden;white-space:nowrap;">Don't expand if the text overflows, but shrink if not enough space</td>
<td>Cell 2</td>
<td>Cell 3</td>
</tr>
This works pretty well for the most part, however when you start shrinking down the window, Cell 2 and Cell 3 would also start collapsing.
Essentially my requirement is:
- First Table Cell should always maintain a width of 70%
- First Table Cell must not expand beyond 70% under any reason
- Cell 2 and Cell 3 must maintain a minimum width, even at the cost of shrinking the first table cell
Or to put it simply:
I want the same behavior as without table-layout: fixed, but the first cell should never expand beyond 70%
It seems like there's no way I can enforce a cell's max-width without table-layout: fixed
It also seems like there's no way to enforce a cell's min-width with table-layout: fixed
Any help would be appreciated