CODEWITHSUNDEEP
cssdatatables
mr-smudge
mr-smudge

Reputation: 125

Datatables limit row height

This seems like a simple problem, but I can't seem to work it out.

I have a Datatables table, and one of the elements contains a free-form text field. When displayed in the table, I want this to only display the first line of this text field, rather than all of it.

I've created a jsfiddle here: JSFiddle

And an example picture showing what I'm trying to achieve: Example image

I've tried to set the height of the <td> as below, but this doesn't work.

height:     20px !important;
min-height: 20px !important;
max-height: 20px !important;

It works for expanding the cells larger (eg: 80px), but not smaller...

I also tried this: JQuery Datatables row height but no joy.

Any help would be greatly appreciated.

Upvotes: 2

Views: 6009

Answers (1)

Raidri
Raidri

Reputation: 17550

It works when you put a block element inside your td, for example a div. See the updated fiddle for the working code. If you only want to limit bigger cells you should then use max-height in your CSS.

            <tr>
                <td>Brazil</td>
                <td>
                    <div>
                        500
                        <br>500
                        <br>500
                        <br>
                    </div>
                </td>
                <td>200</td>
            </tr>

Upvotes: 3

Related Questions