奇怪的文字環繞問題，ie 9和10.

我在這裏有一個有趣的問題。我有一個包裝在div中的鏈接。奇怪的文字環繞問題，ie 9和10.

<div class="field-content news-panel-title"> 
    <a href="/news/">Chiquita Fresh North America Recognizes My Company with Chiquita Green Transportation Excellence Award</a> 
</div>

的CSS如下：

.news-panel-title { 
margin-top: 1px; 
margin-left: 15px; 
width: 500px; 
float: left; 
white-space: nowrap; 
overflow: hidden; 
text-overflow: ellipsis; 
font-size: 1.2em; 
}

我的問題是關於IE 9和10，（雖然搞笑不夠IE 8）文本將中途的自動換行。在IE 8上，至少整個單詞都在包裝。我嘗試將display：inline-block，width，text-overflow，overflow和white-space直接應用到錨本身，而沒有額外的運氣。我在這裏做錯了什麼？那部分詞彙包裝又是什麼？當然，在Chrome/Firefox上一切都是潔淨的。 Doctype html5。

來源

2012-12-03 Drew Curley

嘗試加入'自動換行：正常;'也許？如果您爲此設置了一個快速jsfiddle，它可能會幫助人們解決您的問題:) – Ennui

不可再生。由於'white-space：nowrap'的原因，文本根本沒有換行（保持在一行）。請提供一個更完整的例子來說明問題。 –

您是否嘗試過此屬性？

-ms-word-wrap: break-word;

來源

2013-01-19 12:47:17 Dyn

嘗試改變CSS以下幾點：

.news-panel-title { 
margin-top: 1px; 
margin-left: 15px; 
width: 500px; 
float: left; 
white-space: nowrap; 
overflow: hidden; 
text-overflow: ellipsis; 
font-size: 1.2em; 
word-break: break-all; 
-ms-word-break: break-all; 
}

來源

2013-11-16 11:51:21

奇怪的文字環繞問題，ie 9和10.

回答

相關問題