One of the columns in my table can contain a long text without whitespaces. How can I limit its width to, say, 150px? I don't want it to be 150px always (if it's empty it should be narrow), but if there is a long text I want it to be limited with 150px and the text to be wrapped.
Here is a test example: http://jsfiddle.net/Kh378/ (let's limit the 3rd column).
Thank you in advance.
Update:
Setting this styles:
word-wrap: break-word; max-width: 150px;
does not work in IE8 (tested on different computers) and I suppose it does not work in any version of IE.
1) Specify width for each column in <th> according to your need. 2) Add word wrap for each <td> in <tr> of the <table> .
Using width attribute: The <td> tag has width attribute to control the width of a particular column. By assigning a numeric value to this attribute between 0 to 100 in terms of percentage(or you can use pixel format). We can restrict the column width up to that much percentage of the table's total width.
To set the table width in HTML, use the style attribute. The style attribute specifies an inline style for an element. The attribute is used with the HTML <table> tag, with the CSS property width.
Updated
On the table's td
and th
tags I added:
word-wrap: break-word; max-width: 150px;
Not fully compatible in every browser but a start.
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