title: Internet Explorer not rendering the leading text in a custom list item
body: <p>This is a follow-up to <a href="https://stackoverflow.com/q/3200249/1497596">How to create a custom list style with a dash</a>.</p>
  
  <p>Specifically, my question concerns <strong>Internet Explorer 9</strong>. <em>(Refer to my sample XHTML document at the end of this question. My sample document includes inline CSS.)</em></p>
  
  <p>When I view my sample XHTML document as a <strong>local file</strong>, I see the expected result in IE9:</p>
  
  <pre class="lang-none prettyprint-override"><code>Here is a list:
  - One
  - Two
  - Three
  </code></pre>
  
  <p><em>However</em>, when I view this same XHTML document via <strong>IIS</strong>, I see something different in IE9:</p>
  
  <pre class="lang-none prettyprint-override"><code>Here is a list:
    One
    Two
    Three
  </code></pre>
  
  <p>That is, IE9 is <strong>not rendering the dash</strong> that is intended to appear at the beginning of each list item.</p>
  
  <p>(Note that <strong>Firefox 31</strong> <em>does</em> render the dash when the file is viewed locally as well as via IIS.)</p>
  
  <p>Could this problem be related to the HTTP headers being returned by IIS? Here are the key headers that my instance of IIS is returning:</p>
  
  <pre class="lang-none prettyprint-override"><code>200 OK
  Date: Tue, 09 Sep 2014 18:41:34 GMT
  Server: Microsoft-IIS/7.5
  Content-Length: 706
  Content-Type: text/html
  Title: Custom List Item Test
  X-Powered-By: ASP.NET
  </code></pre>
  
  <hr>
  
  <p><strong>Sample XHTML document:</strong></p>
  
  <pre class="lang-html prettyprint-override"><code>&lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
  &lt;html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"&gt;
    &lt;head&gt;
      &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8" /&gt;
      &lt;title&gt;Custom List Item Test&lt;/title&gt;
  
      &lt;!-- https://stackoverflow.com/a/24279072/1497596 --&gt;
      &lt;style type="text/css"&gt;
        ul
        {
          list-style-type: none;
        }
  
        ul &gt; li:before
        {
          content: "-";
          position: absolute;
          margin-left: -1.1em;
        }
      &lt;/style&gt;
    &lt;/head&gt;
    &lt;body&gt;
      &lt;h1&gt;Here is a list:&lt;/h1&gt;
      &lt;ul&gt;
        &lt;li&gt;One&lt;/li&gt;
        &lt;li&gt;Two&lt;/li&gt;
        &lt;li&gt;Three&lt;/li&gt;
      &lt;/ul&gt;
    &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>