I am working with a table that looks like the one below:
+-----+-----+-----+-----+-----+-----+
| | | | | | |
+-----+-----+-----+-----+-----+-----+
| | | | | | |
+-----+-----+-----+-----+-----+-----+
| | | | | | |
+-----+-----+-----+-----+-----+-----+
| | | | | | |
+-----+-----+-----+-----+-----+-----+
Currently, the table has a width of 100%. I have set word-wrap: break-word to prevent text overflow from cells when resizing. However, my goal is to set a maximum width for the table and ensure all columns maintain equal widths upon resize. How can I achieve this?
You can view my code on JSFiddle.