Question

I am trying to make all the rows of a table the same height as the one that has the longest text in it, expanding accordingly.

But all I achieved is give them a fixed height after reading this:
How can I force all rows in a table to have the same height

This means that I need to predict how much text I should put in it which is obviously not predictable. Is it possible with CSS or do I need using Javascript?

Answer 1

It’s not possible with pure CSS.

It’s possible to do it with javascript. For example, with jQuery you could write something like

var maxHeight = null;
$(<MY LINES>).each(function() {
    var thisHeight = $(this).height();
    if(maxHeight == null || thisHeight > maxHeight) maxHeight = thisHeight;
}).height(maxHeight);

Don’t forget to handle borderline cases and to include a maximum and a minimum height to your lines.