HTML Fixed Width Table Cell – overflow:hidden won’t work

In some cases you will create an HTML table on your page for displaying content in a table structure or organizing the content on your page. Sometimes it is okay to have a variable-width cell but in some cases you will like to have fixed-width table cells so that when a bigger/longer content is placed, it will not expand and distort the way your content is displayed or corrupt your page structure. There are actually 2 simple steps to follow to achieve this:

1- Add the style below to your “table” element

2- Add the two styles below to your “column” element (td)

Now your table column will keep it’s width at a fixed value that you specify and the rest of the content that won’t fit in this column will be hidden.
Hope this helps.
Good Luck,

Leave a Reply

Your email address will not be published. Required fields are marked *