Internet Explorer 10 word break not working

Question

我希望文本可以根據表格寬度進行換行。我的CSS作品無處不在（火狐，Chrome，IE，甚至其它版本），除了IE 10

這是HTML代碼：

<div class="container"> 
    <table class="table"> 
    <tbody class="tBody"> 
     <tr> 
     <td> 
      <span class="spanClass"> 
      <img src="image.png"> 
       <a href="">This is a verrrrrrrrrrrrrrrrrrrrrrrrrrrrrrryyyyy long 
         text that doesnt work like I want it to. I hate IE. 
       </a> 
      </span> 
     </td> 
     </tr> 
    </tbody> 
    </table> 
</div> 

這是CSS：

.container { 
    white-space: pre-wrap; 
    display: inline-table; 
    word-wrap: break-word; 
    word-break: break-all; 
} 

table { 
    width:100%; 
    table-layout:fixed; 
} 

.spanClass { 
    display: inline-flex; 
} 

伊夫注意到.spanClass規則可能會干擾我想要的內容，但我需要該規則以使<img>和<a>元素在其他瀏覽器中正確對齊。

Answer 1

您可以使用下面的CSS，而不是你的：

.spanClass { 
    display: inline-block; 
    word-wrap: break-word; 
    word-break: break-all; 
}