省略號在CSS（」 ...‘）不顯示

CSS的孩子的div像下面省略號在CSS（」 ...‘）不顯示

width: 65%; 
    display: inline-block; 
    margin: 15px 20px; 
    font-size: 28px; 
    font-weight: bold; 
    line-height: 29px; 
    max-height: 89px; 
    min-height: 89px; 
    overflow: hidden; 
    text-overflow: ellipsis;

所以當我有文字了側格文本越來越剪輯，但不能看到省略號（即’ ... 「）

JSFiddle

我希望省略號使」 ...」進來最後一行文字如果是外面的div

來源

2015-07-02 Urvish

[問題文本溢出：省略號]的可能重複（HTTP：// stackoverflow.com/questio ns/11619489/issues-with-text-overflow-ellipsis） –

你忘了主要規則：

white-space: nowrap;

小提琴：http://jsfiddle.net/o411kdbg/1/

多行

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,600,700); 
 
* { 
 
    margin: 0; 
 
    padding: 0; 
 
    -moz-box-sizing: border-box; 
 
    -webkit-box-sizing: border-box; 
 
    box-sizing: border-box; 
 
} 
 

 
body { 
 
    padding: 3em 2em; 
 
    font-family: 'Open Sans', Arial, sans-serif; 
 
    color: #cf6824; 
 
    background: #f7f5eb; 
 
} 
 

 
p { 
 
    display: block; 
 
    /* Fallback for non-webkit */ 
 
    display: -webkit-box; 
 
    max-width: 400px; 
 
    height: 109.2px; 
 
    /* Fallback for non-webkit */ 
 
    margin: 0 auto; 
 
    font-size: 26px; 
 
    line-height: 1.4; 
 
    -webkit-line-clamp: 3; 
 
    -webkit-box-orient: vertical; 
 
    overflow: hidden; 
 
    text-overflow: ellipsis; 
 
}

<p>Pages that you view in incognito tabs won’t stick around in your browser’s history, cookie store or search history after you’ve closed all of your incognito tabs. Any files that you download or bookmarks that you create will be kept.</p>

來源

2015-07-02 11:48:56

white-space：nowrap; 加入這個使多行在單行中 – Urvish

想要多行省略號 – Urvish

@Urvish更新了答案!!! –

省略號在CSS（」 ...‘）不顯示

回答

相關問題