Why does it when I set the width size of a table cell to 100% they don't render evenly?

Hi there @itsxxtx . The issue arises because table cells (<td>) follow table-specific width distribution rules rather than behaving like block elements. When you set width: 100%, it doesn’t make the cell span the entire table but instead fills the column based on content and table constraints. The presence of max-width: 4rem limits each cell’s width, but since table columns adjust dynamically to fit content, different cells can end up with different sizes. The default table-layout: auto further influences this behavior by measuring content first before distributing space. Using table-layout: fixed would enforce equal column widths, while width: 100vw; forces the cells to match the viewport width, bypassing normal table calculations.

1 Like