[解決済み] div 内でテキストを 2 行で折り返す

質問

特定の幅のdivの中で、テキストを2行で囲みたいのです。テキストが2行の長さを超えた場合、私は楕円を表示したいです。 CSSを使用してそれを行う方法はありますか？

例

Sample text showing wrapping
of text in only two line...

どのように解決するのですか？

出力を2行に制限することはCSSで可能です。 line-height と height を設定し overflow:hidden; :

#someDiv {
    line-height: 1.5em;
    height: 3em;       /* height is 2x line-height, so two lines will display */
    overflow: hidden;  /* prevents extra lines from being visible */
}

--- jsFiddleのデモをご覧ください。

また、CSSの text-overflow と white-space プロパティを使用して楕円を追加することができますが、これは1行に対してのみ機能するようです。

#someDiv {
    line-height: 1.5em;
    height: 3em;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    width: 100%;
}

デモも

--- jsFiddleのデモです。

複数行のテキストと楕円の両方を実現するのは、javascriptの領域であるように見えます。