How can I restrict the table <td>
entry to expanding over the entire screen when
the entry is too long?
To prevent cells (rows) from expanding vertically, you have to set a fixed height for table rows. Select the relevant rows and, on the Table Tools Layout tab, click Properties. On the Row tab, select "Specify height" and then choose "Exactly" for "Row height is." Specify the desired amount.
By using CSS, the styling of HTML elements is easy to modify. To fix the width of td tag the nth-child CSS is used to set the property of specific columns(determined by the value of n) in each row of the table.
To set the cell width and height, use the CSS style. The height and width attribute of the <td> cell isn't supported in HTML5. Use the CSS property width and height to set the width and height of the cell respectively. Just keep in mind, the usage of style attribute overrides any style set globally.
Well, there's max-width
, max-height
, and overflow
in CSS.
So
td.whatever { max-width: 150px; max-height: 150px; overflow: hidden; }
would restrict the maximum width and height to 150px, and it can be anything from less than 150 up to 150, and anything that doesn't fit inside that will be clipped off and hidden from view.
Overflow's default (overflow: visible;
) is to simply allow anything that won't fit inside its specified container to just spill over outside of it. If you only want to limit it horizontally and don't want to hide anything, word-wrap
may help:
td.whatever { max-width: 150px; word-wrap: break-word; }
word-wrap
will break words whenever it needs to, even if it's not at the end of a word. You can also just use height
and width
to specify a fixed size if you don't want the table to expand or shrink at all.
You could use word-wrap:break-word;
, so overlong words get wrapped.
td.whatever_class{
max-width: 100px;
}
replace 100px with however wide you want. 1000px is a good width for websites as it will fit on nearly all monitors people have today, so if you had 20 columns then make it 50px for example.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With