title: Using text-transform property inside a span tag inside an H1 tag
body: <p>I know that <code>&lt;span&gt;</code> tags are allowed inside of <code>&lt;H1&gt;</code> tags. However, when I style said span with the text-transform property, it doesn't work - while other properties such as color, size, font-family, etc. do work. Why?</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>h1 {
    font-size: 24px;
    }
  h1 span {
    text-transform: capitalize;
    font-size: 18px;
    color: red;
    }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;h1&gt;Title - &lt;span&gt;something else&lt;/span&gt;&lt;/h1&gt;</code></pre>
  </div>
  </div>
  </p>