CSS fixed table minimum width

Viewed 27

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

0 Answers
Related