2016-09-07 75 views
10

從Chrome 53開始,我們注意到了一個新的CSS相關問題。Chrome 53在LI元素中引入不需要的間距

這個問題也可以在Vivaldi中看到(它基於與Chrome相同的引擎)。同樣的問題是沒有看到在Safari或Firefox或Chrome 52

例如,在這裏:https://mobilefirstplatform.ibmcloud.com/tutorials/en/foundation/8.0/using-the-mfpf-sdk/

enter image description here

這是一個規範的變化,需要更新我們的CSS或實際的錯誤在渲染髮動機?

更新:這是看似發生的,因爲list-style-position:inside

<ul style="list-style-position:inside"> 
 
    <li>li element 1</li> 
 
    <li>li element 2</li> 
 
</ul>

當用於中,除了針對L1元件得到推按預期內,子彈和文本也增加之間的間距。刪除CSS規則,項目符號和文本之間的間距要小得多。

我們該如何解決這個問題?

+0

有人標誌着這個關閉,因爲它不是關於編程?你在跟我開玩笑嗎...?這是關於CSS。它完全是主題。 –

+0

不,他們投票結束,因爲這個「尋求調試幫助的問題(」爲什麼不是這個代碼工作?「)必須包含所需的行爲,特定的問題或錯誤**以及重現它所需的最短代碼問題本身**沒有明確問題陳述的問題對其他讀者無益,請參閱:如何創建最小,完整和可驗證示例。「強調我的。請提供一個測試用例,而不要只鏈接到非現場資源。 –

+0

瞭解。完成。 –

回答

4

不能說如果這是一個怪癖或規格的變化,而是一種解決方法是設置列表樣式外,並代替填充使用左邊距:

.tutorial .sidebar .navmenu-default .navmenu-nav.dropdown-menu>li.active>ul>li { 
     list-style-position: outside; 
} 
.tutorial .sidebar ul { 
    margin-left: 10px; 
    padding: 0; 
}