<p dir="auto">Challenge <a href="https://www.freecodecamp.com/challenges/create-a-set-of-checkboxes#?solution=%0A%3Clink%20href%3D%22https%3A%2F%2Ffonts.googleapis.com%2Fcss%3Ffamily%3DLobster%22%20rel%3D%22stylesheet%22%20type%3D%22text%2Fcss%22%3E%0A%3Cstyle%3E%0A%20%20.red-text%20%7B%0A%20%20%20%20color%3A%20red%3B%0A%20%20%7D%0A%0A%20%20h2%20%7B%0A%20%20%20%20font-family%3A%20Lobster%2C%20Monospace%3B%0A%20%20%7D%0A%0A%20%20p%20%7B%0A%20%20%20%20font-size%3A%2016px%3B%0A%20%20%20%20font-family%3A%20Monospace%3B%0A%20%20%7D%0A%0A%20%20.thick-green-border%20%7B%0A%20%20%20%20border-color%3A%20green%3B%0A%20%20%20%20border-width%3A%2010px%3B%0A%20%20%20%20border-style%3A%20solid%3B%0A%20%20%20%20border-radius%3A%2050%25%3B%0A%20%20%7D%0A%0A%20%20.smaller-image%20%7B%0A%20%20%20%20width%3A%20100px%3B%0A%20%20%7D%0A%3C%2Fstyle%3E%0A%0A%3Ch2%20class%3D%22red-text%22%3ECatPhotoApp%3C%2Fh2%3E%0A%0A%3Cp%3EClick%20here%20for%20%3Ca%20href%3D%22%23%22%3Ecat%20photos%3C%2Fa%3E.%3C%2Fp%3E%0A%0A%3Ca%20href%3D%22%23%22%3E%3Cimg%20class%3D%22smaller-image%20thick-green-border%22%20alt%3D%22A%20cute%20orange%20cat%20lying%20on%20its%20back.%20%22%20src%3D%22https%3A%2F%2Fbit.ly%2Ffcc-relaxing-cat%22%3E%3C%2Fa%3E%0A%0A%3Cp%3EThings%20cats%20love%3A%3C%2Fp%3E%0A%3Cul%3E%0A%20%20%3Cli%3Ecat%20nip%3C%2Fli%3E%0A%20%20%3Cli%3Elaser%20pointers%3C%2Fli%3E%0A%20%20%3Cli%3Elasagna%3C%2Fli%3E%0A%3C%2Ful%3E%0A%3Cp%3ETop%203%20things%20cats%20hate%3A%3C%2Fp%3E%0A%3Col%3E%0A%20%20%3Cli%3Eflea%20treatment%3C%2Fli%3E%0A%20%20%3Cli%3Ethunder%3C%2Fli%3E%0A%20%20%3Cli%3Eother%20cats%3C%2Fli%3E%0A%3C%2Fol%3E%0A%3Cform%20fccfaa%3D%22%2Fsubmit-cat-photo%22%3E%0A%20%20%3Clabel%3E%3Cinput%20type%3D%22checkbox%22%20name%3D%22personality%22%3E%20Loving%3C%2Flabel%3E%0A%20%20%3Clabel%3E%3Cinput%20type%3D%22checkbox%22%20name%3D%22personality%22%3ELoving%3C%2Flabel%3E%0A%20%20%3Clable%3E%3Cinput%20type%3D%22checkbox%22%20name%3D%22personality%22%3ELoving%3C%2Flable%3E%0A%20%20%3Clabel%3E%3Cinput%20type%3D%22checkbox%22%20name%3D%22personaliy%22%3ELoving%3C%2Flabel%3E%0A%20%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%20%3Clabel%3E%3Cinput%20type%3D%22radio%22%20name%3D%22indoor-outdoor%22%3E%20Indoor%3C%2Flabel%3E%0A%20%20%3Clabel%3E%3Cinput%20type%3D%22radio%22%20name%3D%22indoor-outdoor%22%3E%20Outdoor%3C%2Flabel%3E%0A%20%20%3Cinput%20type%3D%22text%22%20placeholder%3D%22cat%20photo%20URL%22%20required%3E%0A%20%20%3Cbutton%20type%3D%22submit%22%3ESubmit%3C%2Fbutton%3E%0A%3C%2Fform%3E%0A" rel="nofollow">Create a Set of Checkboxes</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.</p>
<p dir="auto">My code:</p>
<div class="snippet-clipboard-content notranslate position-relative overflow-auto" data-snippet-clipboard-copy-content="
&lt;link href=&quot;https://fonts.googleapis.com/css?family=Lobster&quot; rel=&quot;stylesheet&quot; type=&quot;text/css&quot;&gt;
&lt;style&gt;
  .red-text {
    color: red;
  }

  h2 {
    font-family: Lobster, Monospace;
  }

  p {
    font-size: 16px;
    font-family: Monospace;
  }

  .thick-green-border {
    border-color: green;
    border-width: 10px;
    border-style: solid;
    border-radius: 50%;
  }

  .smaller-image {
    width: 100px;
  }
&lt;/style&gt;

&lt;h2 class=&quot;red-text&quot;&gt;CatPhotoApp&lt;/h2&gt;

&lt;p&gt;Click here for &lt;a href=&quot;#&quot;&gt;cat photos&lt;/a&gt;.&lt;/p&gt;

&lt;a href=&quot;#&quot;&gt;&lt;img class=&quot;smaller-image thick-green-border&quot; alt=&quot;A cute orange cat lying on its back. &quot; src=&quot;https://bit.ly/fcc-relaxing-cat&quot;&gt;&lt;/a&gt;

&lt;p&gt;Things cats love:&lt;/p&gt;
&lt;ul&gt;
  &lt;li&gt;cat nip&lt;/li&gt;
  &lt;li&gt;laser pointers&lt;/li&gt;
  &lt;li&gt;lasagna&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;Top 3 things cats hate:&lt;/p&gt;
&lt;ol&gt;
  &lt;li&gt;flea treatment&lt;/li&gt;
  &lt;li&gt;thunder&lt;/li&gt;
  &lt;li&gt;other cats&lt;/li&gt;
&lt;/ol&gt;
&lt;form action=&quot;/submit-cat-photo&quot;&gt;
  &lt;label&gt;&lt;input type=&quot;checkbox&quot; name=&quot;personality&quot;&gt; Loving&lt;/label&gt;
  &lt;label&gt;&lt;input type=&quot;checkbox&quot; name=&quot;personality&quot;&gt;Loving&lt;/label&gt;
  &lt;lable&gt;&lt;input type=&quot;checkbox&quot; name=&quot;personality&quot;&gt;Loving&lt;/lable&gt;
  &lt;label&gt;&lt;input type=&quot;checkbox&quot; name=&quot;personaliy&quot;&gt;Loving&lt;/label&gt;


                &lt;label&gt;&lt;input type=&quot;radio&quot; name=&quot;indoor-outdoor&quot;&gt; Indoor&lt;/label&gt;
  &lt;label&gt;&lt;input type=&quot;radio&quot; name=&quot;indoor-outdoor&quot;&gt; Outdoor&lt;/label&gt;
  &lt;input type=&quot;text&quot; placeholder=&quot;cat photo URL&quot; required&gt;
  &lt;button type=&quot;submit&quot;&gt;Submit&lt;/button&gt;
&lt;/form&gt;
"><pre class="notranslate"><code class="notranslate">
&lt;link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css"&gt;
&lt;style&gt;
  .red-text {
    color: red;
  }

  h2 {
    font-family: Lobster, Monospace;
  }

  p {
    font-size: 16px;
    font-family: Monospace;
  }

  .thick-green-border {
    border-color: green;
    border-width: 10px;
    border-style: solid;
    border-radius: 50%;
  }

  .smaller-image {
    width: 100px;
  }
&lt;/style&gt;

&lt;h2 class="red-text"&gt;CatPhotoApp&lt;/h2&gt;

&lt;p&gt;Click here for &lt;a href="#"&gt;cat photos&lt;/a&gt;.&lt;/p&gt;

&lt;a href="#"&gt;&lt;img class="smaller-image thick-green-border" alt="A cute orange cat lying on its back. " src="https://bit.ly/fcc-relaxing-cat"&gt;&lt;/a&gt;

&lt;p&gt;Things cats love:&lt;/p&gt;
&lt;ul&gt;
  &lt;li&gt;cat nip&lt;/li&gt;
  &lt;li&gt;laser pointers&lt;/li&gt;
  &lt;li&gt;lasagna&lt;/li&gt;
&lt;/ul&gt;
&lt;p&gt;Top 3 things cats hate:&lt;/p&gt;
&lt;ol&gt;
  &lt;li&gt;flea treatment&lt;/li&gt;
  &lt;li&gt;thunder&lt;/li&gt;
  &lt;li&gt;other cats&lt;/li&gt;
&lt;/ol&gt;
&lt;form action="/submit-cat-photo"&gt;
  &lt;label&gt;&lt;input type="checkbox" name="personality"&gt; Loving&lt;/label&gt;
  &lt;label&gt;&lt;input type="checkbox" name="personality"&gt;Loving&lt;/label&gt;
  &lt;lable&gt;&lt;input type="checkbox" name="personality"&gt;Loving&lt;/lable&gt;
  &lt;label&gt;&lt;input type="checkbox" name="personaliy"&gt;Loving&lt;/label&gt;


                &lt;label&gt;&lt;input type="radio" name="indoor-outdoor"&gt; Indoor&lt;/label&gt;
  &lt;label&gt;&lt;input type="radio" name="indoor-outdoor"&gt; Outdoor&lt;/label&gt;
  &lt;input type="text" placeholder="cat photo URL" required&gt;
  &lt;button type="submit"&gt;Submit&lt;/button&gt;
&lt;/form&gt;

</code></pre></div>
<h4 dir="auto">Challenge Name</h4>

<p dir="auto">All</p>
<h4 dir="auto">Issue Description</h4>

<p dir="auto">After passing a few exercises, the display on the phone on the right hand side of the code doesn't work (phone remains blank). Also, the text under run text where it normally shows which criteria have to be met for the code to be accepted is also missing. These issues are fixed after multiple refreshes of the page.</p>
<h4 dir="auto">Browser Information</h4>

<p dir="auto">Same error appears on both Google Chrome (Version 52.0.2743.116 m), and Microsoft Edge (25.10586.0.0). Haven't tried any other browsers.</p>
<ul dir="auto">
<li>Browser Name, Version: Google Chrome (Version 52.0.2743.116 m) and Microsoft Edge (25.10586.0.0)</li>
<li>Operating System: Windows 10 Version 1511</li>
<li>Mobile, Desktop, or Tablet: Desktop</li>
</ul>
<h4 dir="auto">Screenshot</h4>

<p dir="auto"><a href="http://imgur.com/yV3BNJ1" rel="nofollow">http://imgur.com/yV3BNJ1</a></p>