避免Firefox中的元素纏繞

div中的跨度下降到下一行，div嵌套在Firefox中的第tr tr內。如何避免這種情況？該代碼適用於Chrome和IE。避免Firefox中的元素纏繞

我的HTML

<table> 
    <thead> 
     <tr> 
      <th><div>2016<span >span</span></div></th> 
      <th><div>2017<span class="ui-icon ui-icon-carat-2-n-s"></span></div></th> 
      <th><div>2018<span class="ui-icon ui-icon-carat-2-n-s"></span></div></th> 
     </tr> 
</thead> 
<tbody> 
    <tr> 
     <td>1</td> 
     <td>2</td> 
     <td>3</td> 
    </tr> 
</tbody> 
</table>

我的CSS

table thead tr th { 
    text-align:right; 
    white-space:nowrap; 
} 
table thead tr th div span { 
    display:block; 
    float:right; 
}

在jsFiddle

來源

2015-09-23 agri

本工程爲第一跨度，但如果有jQuery用戶界面添加了.ui-icon類，其中顯示設置爲阻止，然後也需要重寫以顯示：inline-block。不知道是否有更好的方法..我接受答案，因爲我沒有指定ui-icon類。謝謝。 – agri

刪除跨度看到該組。

試試這個。

table thead tr th div { 
    display:block; 
    float:right; 
}

Demo Here

來源

2015-09-23 10:29:14

嘗試這樣的：Demo

table thead tr th div+span{ 
    display:block; 
    float:right; 
}

欲瞭解更多信息點擊這裏Link

來源

2015-09-23 10:29:37

避免Firefox中的元素纏繞

回答

相關問題