Limiting number of text lines in a table cell

Posted by Kuzco on Stack Overflow See other posts from Stack Overflow or by Kuzco
Published on 2011-01-16T13:46:56Z Indexed on 2011/01/16 13:53 UTC
Read the original article Hit count: 144

Filed under:
|

I have a table cell where I need to limit the text to a max of two lines.
I tried achieving this by placing an inner div with a limited height:

div 
{ 
  border: 1px solid #EECCDD;  
  width: 100px;
  height: 40px; 
  overflow: hidden; 
}

<div>
   <p>bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla bla</p>
</div>
<div>
   <p>bla bla bla bla</p>
</div>

However, in this case the cells which have only one line of text are not vertically aligned to the middle. I know there are ways to vertically align a text within a div, but most of the ones I found seemed a bit complicated and/or hacky (like this one), and felt like a bit of an overkill.

Is there a different way to effectively limit the number of lines inside the cell, or a simple way to align the text in the way I did it?

© Stack Overflow or respective owner

Related posts about html

Related posts about css