<p dir="auto">Challenge <a href="https://www.freecodecamp.com/en/challenges/html5-and-css/use-hex-code-to-mix-colors" rel="nofollow">use-hex-code-to-mix-colors</a> has an issue.<br>
User Agent is: <code class="notranslate">Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36</code>.<br>
Please describe how to reproduce this issue, and include links to screenshots if possible.<br>
code is correct but test run is not validating properly.</p>
<div class="highlight highlight-text-html-basic notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="

&lt;style&gt;
.red-text {
  color: #FF0000;
}
.green-text {
  color: #00FF00;
}
.dodger-blue-text {
  color: #1E90FF;
}
.orange-text {
  color:    #FFA500;
}
&lt;/style&gt;

&lt;h1 class=&quot;red-text&quot;&gt;I am red!&lt;/h1&gt;

&lt;h1 class=&quot;green-text&quot;&gt;I am green!&lt;/h1&gt;

&lt;h1 class=&quot;dodger-blue-text&quot;&gt;I am dodger blue!&lt;/h1&gt;

&lt;h1 class=&quot;orange-text&quot;&gt;I am orange!&lt;/h1&gt;

    ```
"><pre class="notranslate"><span class="pl-kos">&lt;</span><span class="pl-ent">style</span><span class="pl-kos">&gt;</span>
.<span class="pl-c1">red-text</span> {
  <span class="pl-c1">color</span><span class="pl-kos">:</span> <span class="pl-pds"><span class="pl-kos">#</span>FF0000</span>;
}
.<span class="pl-c1">green-text</span> {
  <span class="pl-c1">color</span><span class="pl-kos">:</span> <span class="pl-pds"><span class="pl-kos">#</span>00FF00</span>;
}
.<span class="pl-c1">dodger-blue-text</span> {
  <span class="pl-c1">color</span><span class="pl-kos">:</span> <span class="pl-pds"><span class="pl-kos">#</span>1E90FF</span>;
}
.<span class="pl-c1">orange-text</span> {
  <span class="pl-c1">color</span><span class="pl-kos">:</span>    <span class="pl-pds"><span class="pl-kos">#</span>FFA500</span>;
}
<span class="pl-kos">&lt;/</span><span class="pl-ent">style</span><span class="pl-kos">&gt;</span>

<span class="pl-kos">&lt;</span><span class="pl-ent">h1</span> <span class="pl-c1">class</span>="<span class="pl-s">red-text</span>"<span class="pl-kos">&gt;</span>I am red!<span class="pl-kos">&lt;/</span><span class="pl-ent">h1</span><span class="pl-kos">&gt;</span>

<span class="pl-kos">&lt;</span><span class="pl-ent">h1</span> <span class="pl-c1">class</span>="<span class="pl-s">green-text</span>"<span class="pl-kos">&gt;</span>I am green!<span class="pl-kos">&lt;/</span><span class="pl-ent">h1</span><span class="pl-kos">&gt;</span>

<span class="pl-kos">&lt;</span><span class="pl-ent">h1</span> <span class="pl-c1">class</span>="<span class="pl-s">dodger-blue-text</span>"<span class="pl-kos">&gt;</span>I am dodger blue!<span class="pl-kos">&lt;/</span><span class="pl-ent">h1</span><span class="pl-kos">&gt;</span>

<span class="pl-kos">&lt;</span><span class="pl-ent">h1</span> <span class="pl-c1">class</span>="<span class="pl-s">orange-text</span>"<span class="pl-kos">&gt;</span>I am orange!<span class="pl-kos">&lt;/</span><span class="pl-ent">h1</span><span class="pl-kos">&gt;</span>

    ```</pre></div>
<p dir="auto">Challenge <a href="https://www.freecodecamp.com/en/challenges/html5-and-css/use-hex-code-to-mix-colors" rel="nofollow">use-hex-code-to-mix-colors</a> has an issue.<br>
User Agent is: <code class="notranslate">Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/52.0.2743.116 Safari/537.36</code>.<br>
Please describe how to reproduce this issue, and include links to screenshots if possible.</p>
<div class="highlight highlight-text-html-basic notranslate position-relative overflow-auto" dir="auto" data-snippet-clipboard-copy-content="

&lt;style&gt;
.red-text {
  color: #ff0000;
}
.green-text {
  color: #00ff00;
}
.dodger-blue-text {
  color: #1e90ff;
}
.orange-text {
  color: #ffa500;
}
&lt;/style&gt;

&lt;h1 class=&quot;red-text&quot;&gt;I am red!&lt;/h1&gt;

&lt;h1 class=&quot;green-text&quot;&gt;I am green!&lt;/h1&gt;

&lt;h1 class=&quot;dodger-blue-text&quot;&gt;I am dodger blue!&lt;/h1&gt;

&lt;h1 class=&quot;orange-text&quot;&gt;I am orange!&lt;/h1&gt;

    ```

Screenshot:
![image](https://cloud.githubusercontent.com/assets/3306170/18378269/47f34348-766c-11e6-8fb7-6e2da365ced7.png)"><pre class="notranslate"><span class="pl-kos">&lt;</span><span class="pl-ent">style</span><span class="pl-kos">&gt;</span>
.<span class="pl-c1">red-text</span> {
  <span class="pl-c1">color</span><span class="pl-kos">:</span> <span class="pl-pds"><span class="pl-kos">#</span>ff0000</span>;
}
.<span class="pl-c1">green-text</span> {
  <span class="pl-c1">color</span><span class="pl-kos">:</span> <span class="pl-pds"><span class="pl-kos">#</span>00ff00</span>;
}
.<span class="pl-c1">dodger-blue-text</span> {
  <span class="pl-c1">color</span><span class="pl-kos">:</span> <span class="pl-pds"><span class="pl-kos">#</span>1e90ff</span>;
}
.<span class="pl-c1">orange-text</span> {
  <span class="pl-c1">color</span><span class="pl-kos">:</span> <span class="pl-pds"><span class="pl-kos">#</span>ffa500</span>;
}
<span class="pl-kos">&lt;/</span><span class="pl-ent">style</span><span class="pl-kos">&gt;</span>

<span class="pl-kos">&lt;</span><span class="pl-ent">h1</span> <span class="pl-c1">class</span>="<span class="pl-s">red-text</span>"<span class="pl-kos">&gt;</span>I am red!<span class="pl-kos">&lt;/</span><span class="pl-ent">h1</span><span class="pl-kos">&gt;</span>

<span class="pl-kos">&lt;</span><span class="pl-ent">h1</span> <span class="pl-c1">class</span>="<span class="pl-s">green-text</span>"<span class="pl-kos">&gt;</span>I am green!<span class="pl-kos">&lt;/</span><span class="pl-ent">h1</span><span class="pl-kos">&gt;</span>

<span class="pl-kos">&lt;</span><span class="pl-ent">h1</span> <span class="pl-c1">class</span>="<span class="pl-s">dodger-blue-text</span>"<span class="pl-kos">&gt;</span>I am dodger blue!<span class="pl-kos">&lt;/</span><span class="pl-ent">h1</span><span class="pl-kos">&gt;</span>

<span class="pl-kos">&lt;</span><span class="pl-ent">h1</span> <span class="pl-c1">class</span>="<span class="pl-s">orange-text</span>"<span class="pl-kos">&gt;</span>I am orange!<span class="pl-kos">&lt;/</span><span class="pl-ent">h1</span><span class="pl-kos">&gt;</span>

    ```

Screenshot:
![image](https://cloud.githubusercontent.com/assets/3306170/18378269/47f34348-766c-11e6-8fb7-6e2da365ced7.png)</pre></div>