title: Setting the spacing for an ol list item
body: <p>In the following code, I find the space between number <strong>1</strong> and content <strong>DIY SMS Export V1.05 has been released</strong> is a little width,
  how can I set the margin between between number and content with CSS?</p>
  
  <p>And more, the webpage have same UI both IE 10.0 and FireFox 21.0 as the following image.</p>
  
  <p><img src="https://i.stack.imgur.com/yI921.png" alt="enter image description here"></p>
  
  <p>but in IE 10.0 compatible mode, the UI changed as the following image. the left margin increased, why? </p>
  
  <p><img src="https://i.stack.imgur.com/R2hir.png" alt="enter image description here"></p>
  
  <pre><code>&lt;%@ Page Language="C#" AutoEventWireup="true" 
      CodeFile="Default2.aspx.cs" Inherits="Default2" %&gt;
  
  &lt;!DOCTYPE html&gt;
  
  &lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;
  &lt;head runat="server"&gt;
      &lt;title&gt;&lt;/title&gt;
       &lt;style type="text/css"&gt;
         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 {
  
          }
      &lt;/style&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;form id="form1" runat="server"&gt;
      &lt;div&gt;
          &lt;ol&gt;
              &lt;li class="A"&gt;DIY SMS Export V1.05 has been released
                  &lt;ol class="C"&gt;
                      &lt;li class="B"&gt;Add the function to delete sms selected&lt;/li&gt;
                  &lt;/ol&gt;
              &lt;/li&gt;
  
              &lt;li class="A"&gt;DIY SMS Export V1.04 has been released
                  &lt;ol class="C"&gt;
                      &lt;li class="B"&gt;Add chinese language support&lt;/li&gt;
                  &lt;/ol&gt;
              &lt;/li&gt;
          &lt;/ol&gt;  
      &lt;/div&gt;
      &lt;/form&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>