Problem with text-overflow:ellipsis

I have a panel on my page that I am trying to stop from becoming too deep, so I have set a max-height and am expecting the text to present me with '...' when the box is no longer large enough. Trouble is, it's not working. The only time I can get CSS to activate the ellipsis is if I use text-overflow:nowrap, but I need it to wrap for three lines maximum before the ellipsis kick in.

I have this a rule in my external style:

.pnlchat {

          background-color: #2a2d2c;

          padding: 35px 35px 28px 35px;

          margin-bottom: 9px;

          max-height:100px;

}

And this is inline CSS:

<div class="pnlchat" style="overflow:hidden; white-space: normal;text-overflow:ellipsis;">

What am I doing wrong?