There is a table with scrolling on flexbox. In the first column, the text outside the cell hides overflow: hidden .

Example

When trying to wrap a table in an additional flex-direction: row container, in order to add a column to the height of the table, the table width is broken.

Example 2

What is the error and how to fix it?

    1 answer 1

    Try to set the width of the table 100% did not try?

      .table { width: 100%; display: flex; flex-direction: column; flex: 1; background: gainsboro; }

    This method turns out that the table is shown as in the first example!

    • It turns out that the table is 100% wide. And the new column with min-width: 40px goes outside. The size of the column must be fixed. I can't use calc() . - ldp.n