title: CSS :first-letter not working
body: <p>I'm trying to apply CSS styles to some HTML snippets that were generated from a Microsoft Word document.  The HTML that Word generated is fairly atrocious, and includes a lot of inline styles.  It goes something like this:</p>
  
  <pre><code>&lt;html&gt;
      &lt;head&gt;&lt;/head&gt;
      &lt;body&gt;
          &lt;center&gt;
              &lt;p class=MsoNormal&gt;&lt;b style='mso-bidi-font-weight:normal'&gt;&lt;span
                 style='font-size:12.0pt;line-height:115%;font-family:"Times New Roman"'&gt;Title text goes here&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/b&gt;&lt;/p&gt;
  
              &lt;p class=MsoNormal style='margin-left:18.0pt;line-height:150%'&gt;&lt;span
                  style='font-size:12.0pt;line-height:150%;font-family:"Times New Roman"'&gt;Content text goes here.&lt;o:p&gt;&lt;/o:p&gt;&lt;/span&gt;&lt;/p&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>...and very simply, I would like to style the first letter of the title section.  It just needs to be larger and in a different font.  To do this I am trying to use the <code>:first-letter</code> selector, with something kind of like:</p>
  
  <pre><code>p b span:first-letter {
      font-size: 500px !important;
  }
  </code></pre>
  
  <p>But it doesn't seem to be working.  Here's a fiddle demonstrating this:</p>
  
  <p><a href="http://jsfiddle.net/KvGr2/" rel="noreferrer">http://jsfiddle.net/KvGr2/</a></p>
  
  <p>Any ideas what is wrong/how to get the first letter of the title section styled correctly?  I can make minor changes to the markup (like adding a wrapper div around things), though not without some difficulty.</p>