CSS - table-layout Property
The table-layout property allows browsers to speed up layout of a table by using the first width properties it comes across for the rest of a column rather than having to load the whole table before rendering it.
Possible Values
auto − The table should be laid out according to some automatic layout algorithm. The browser will calculate the width of columns and cells based on their content.
fixed − The table should be laid out according to the provided fixed-table layout method.
Applies to
All the elements with a display of table or inline-table.
DOM Syntax
object.style.tableLayout = "fixed";
Example
<html> <head> <style> table.auto { table-layout: auto; border-collapse: collapse; } table.fixed { table-layout: fixed; border-collapse: separate; } </style> </head> <body> <div> <h2>table-layout: auto</h2> <table class = "auto" border = "1" width = "100%"> <tr> <td>1000000000000000000000000000</td> <td>10000000</td> <td>100</td> </tr> </table> </div> <div> <h2>table-layout: fixed</h2> <table class = "fixed" border = "1" width = "100%"> <tr> <td>1000000000000000000000000000</td> <td>10000000</td> <td>100</td> </tr> </table> </div> </body> </html>
Advertisements
To Continue Learning Please Login
Login with Google