How to display Full Width Table using CSS?

Full Width Table

To display full width table using CSS, set CSS width property of this table to 100%.

By default, table wraps to its contents. To set a specific width, we may use width property.

Examples

1. Set width of table to 100%

In the following example, we take a table with two columns, and set its width to the full of its parent using CSS width property.

index.html

2. Table with default width

If the width of the table is left to its default value, then the table wraps to its contents, as shown in the following.

index.html

Conclusion

In this CSS Tutorial, we learned how to use CSS width property to display full-width table, with examples.