3 Replies Latest reply: Apr 29, 2013 4:43 PM by Nancy O. RSS

    Problem with text-overflow:ellipsis

    matthew stuart Community Member

      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?