設置間距爲OL列表項

在下面的代碼，我發現數量之間的空間和內容DIY短信導出V1.05已經發布有點寬，如何設置保證金數字與CSS之間的內容之間？設置間距爲OL列表項

此外，該網頁具有與以下圖像相同的UI IE 10.0和FireFox 21.0。

enter image description here

但在IE 10.0兼容模式，則UI改變爲下面的圖像。左邊緣增加了，爲什麼？

enter image description here

<%@ Page Language="C#" AutoEventWireup="true" 
    CodeFile="Default2.aspx.cs" Inherits="Default2" %> 

<!DOCTYPE html> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
    <style type="text/css"> 
     li.A { 
      list-style-type: decimal; 
      font-weight: bold; 
      margin-bottom:15px;   
     } 

     li.B{ 
      list-style-type:upper-alpha; 
      font-weight:normal; 
      margin-top:4px; 
      margin-bottom:4px; 

     } 

     ol.C { 

     } 
    </style> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 
     <ol> 
      <li class="A">DIY SMS Export V1.05 has been released 
       <ol class="C"> 
        <li class="B">Add the function to delete sms selected</li> 
       </ol> 
      </li> 

      <li class="A">DIY SMS Export V1.04 has been released 
       <ol class="C"> 
        <li class="B">Add chinese language support</li> 
       </ol> 
      </li> 
     </ol> 
    </div> 
    </form> 
</body> 
</html>

來源

2013-07-01 HelloCW

HTML5之前，HTML4.01，爲用戶代理的默認CSS只是建議。在列表列表和特別列出了需要壓痕實現要麼margin-left: 40px或Firefox和IE padding-left: 40px（我的意思是Netscape和IE瀏覽器...）

所以光復位如本codepen將走差異化的護理。

CSS

ol, ul, li { 
    margin: 0; 
    padding: 0; 
} 
ol, ul { 
    margin-left: 20px; 
}

來源

2013-07-01 02:12:15 FelipeAls

謝謝！這是否意味着ol列表項無法在IE 6.0中正常工作？ – HelloCW

它工作正常。只有默認的CSS不同（當你通過顯示菜單關閉所有樣式時，仍然會看到這些樣式，我覺得像大H1，LI前面的項目符號等等）。這個默認的CSS是第一個被你的樣式覆蓋的東西，但你首先必須知道這個和那個瀏覽器應用了哪些樣式。 ;）這就是「重置CSS」的目的（我會讓你在SO和Google上搜索這個術語）（或者我的朋友和老闆的極簡主義http://www.knacss.com），只有一個共同的基礎（或nuke每個默認樣式，取決於選擇的解決方案） – FelipeAls

這裏margin-left和padding-left都被設置爲null（所以它現在在每個瀏覽器中都是0，而不是40px），然後用一種方法設置爲20px，每個瀏覽器都一樣（margin-left比padding更實用一些，但兩者都在IE6 +中運行）。 – FelipeAls

設置間距爲OL列表項

回答

相關問題