height 를 강제로 지정하고,  overflow:hidden  처리하는 방법으로 하셔야할겁니다.

html:

<div id='container'>
    <span id='text'>TEXT: 123456789012345678901234567890</span>
</div>

css:

#container {
    width: 200px;
    height: 60px;
    line-height: 20px;
    position: relative;
}

jquery:

var $container = $('#container');
var $text = $('#text');
var originalText = $text.text();
var temp = originalText;

if($container.outerHeight() < $text.outerHeight()) {
    while($container.outerHeight() < $text.outerHeight()) {
        $text.text(temp = temp.substr(0, temp.length-1));
    }
    $text.text(temp = temp.substr(0, temp.length-3));
    $text.append('...');
}

이런식으로 구성해서 자르지않은 #text를 우선 출력하고 script에서 #container의 height와 line-height를 이용해서 height를 벗어나는(위의 예에서는  4번째 라인부터 해당) 라인은 잘라버리는 방법도 가능하겠지만...

overflow:hidden과 차이가 있을까요??