Hello Dash Community! We just shipped two new chapters of extensive DataTable documentation:
- How to set DataTable widths & DataTable column widths: Examples include how to handle word wrapping, cell clipping, horizontal scroll, fixed columns, and more.
- How to set DataTable height: Examples include how to set the height with vertical scroll, pagination, virtualization, and fixed headers.
We took good care to document all of the known limitations with these methods. Some of these limitations will be solved in future versions of Dash, but until then we wanted to save you some time debugging by being upfront with recommended workarounds.
Take a read and let us know what you think! If there are any examples missing, you can comment or edit the files on GitHub and open a pull request.
At time of writing, the following examples are included in the DataTable Width & Column Width chapter:
- Default Width
- Wrapping onto Multiple Lines
- Denser Multi-Line Cells with Line-Height
- Wrapping onto Multiple Lines while Constraining the Height of Cells
- Overflowing Into Ellipses
- Ellipses & Tooltips
- Horizontal Scroll
- Horizontal Scroll with Fixed-Width Columns & Cell Wrapping
- Horizontal Scroll with Fixed-Width & Ellipses
- Horizontal Scrolling via Fixed Columns
- Setting Column Widths
- Percentage Based Widths
- Percentage Based Widths and table-layout: fixed
- Individual Column Widths with Pixels
- Overriding a Single Column’s Width
And the following examples are included in the DataTable Height chapter:
- Setting Table Height with Pagination
- Setting Table Height with Vertical Scroll
- Vertical Scroll With Pagination
- Vertical Scroll With Fixed Headers
- Vertical Scroll with Virtualization
Stay safe & healthy out there –