Technical Documentation Challenge Issue

I’m passing everything on codepen, but on the new platform here, I cannot seems to pass
" Each .main-section should have an id that matches the text of its first child, having any spaces in the child’s text replaced with underscores ( _ ) for the id’s"

I understand exactly what this criteria asks me to do, and I must be missing something small…

Link to codepen:

And section pasted below. Thank you in advance! :smile: strong text

My code so far

<main id = "main-doc">
  <section id ="Introduction" class ="main-section">
    <header>
      <h2>Introduction</h2>  
    </header>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Accumsan tortor posuere ac ut consequat semper.</p>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Sit amet mauris commodo quis imperdiet massa tincidunt nunc. Adipiscing enim eu turpis egestas pretium aenean pharetra. Urna condimentum mattis pellentesque id nibh tortor id. Lectus arcu bibendum at varius. Pretium vulputate sapien nec sagittis aliquam. Feugiat vivamus at augue eget arcu dictum varius. Maecenas sed enim ut sem viverra aliquet eget sit amet.</p>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Accumsan tortor posuere ac ut consequat semper.</p>
  </section>
  <section id= "Engine_Specifications"  class = "main-section">
    <header>
     <h2>Engine Specifications</h2>  
    </header>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Accumsan tortor posuere ac ut consequat semper.</p>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Penatibus et magnis dis parturient montes nascetur ridiculus mus. Libero nunc consequat interdum varius sit. Netus et malesuada fames ac. Felis bibendum ut tristique et egestas quis ipsum.</p>
    <div class ="code-background">
     <code> muskEngine = solarRadiation + efficientBatteryTechCoefficient;
     </code>
    </div>
  </section>
  <section id= "Navigational_Systems" class = "main-section">
    <header>
     <h2>Navigational Systems</h2>  
    </header>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Accumsan tortor posuere ac ut consequat semper.</p>
     <div class ="code-background">
      <code>let e = (mc)^2;</code>
    </div>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Sit amet mauris commodo quis imperdiet massa tincidunt nunc. Adipiscing enim eu turpis egestas pretium aenean pharetra. Urna condimentum mattis pellentesque id nibh tortor id. Lectus arcu bibendum at varius. Pretium vulputate sapien nec sagittis aliquam. Feugiat vivamus at augue eget arcu dictum varius. Maecenas sed enim ut sem viverra aliquet eget sit amet.</p>
    <p>Redirect Emergency Protocols:<p>
    <ol class="li-font">
      <li>Lorem ipsum dolor</li>
      <li>sit amet, consectetur</li>
      <li>dolore magna aliqua</li> 
    </ol>   
  </section>
  <section id = "Cryo_Sleep_Pods"  class = "main-section">
    <header>
      <h2>Cryo Sleep Pods</h2>   
    </header>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Accumsan tortor posuere ac ut consequat semper.</p>
     <div class ="code-background">
      <code>if (emergencySignal) {<br>
        wakeUp == true;<br>
        } else {<br>
        wakeUp == false && continuedMonitor == true;<br>}
      </code>
    </div>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Penatibus et magnis dis parturient montes nascetur ridiculus mus. Libero nunc consequat interdum varius sit. Netus et malesuada fames ac. Felis bibendum ut tristique et egestas quis ipsum.</p>
  </section>
  <section id= "Airlock_Functionality"  class = "main-section">
    <header>
      <h2>Airlock Functionality</h2> 
    </header>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Nullam eget felis eget nunc lobortis mattis aliquam faucibus purus. Diam ut venenatis tellus in. Id nibh tortor id aliquet lectus proin nibh nisl condimentum.</p>
      <p>Steps to open the airlock:</p>
      <ul class="li-font">
        <li>Lorem ipsum dolor sit</li>
        <li>amet, consectetur adipiscing</li>
        <li>lit, sed do eiusmod</li>
        <li>tempor incididunt ut</li>
       </ul>
  </section>
  <section id= "Food_Synthesizer" class ="main-section">
    <header>
      <h2>Food Synthesizer</h2> 
    </header>
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Nullam eget felis eget nunc lobortis mattis aliquam faucibus purus. Diam ut venenatis tellus in. Id nibh tortor id aliquet lectus proin nibh nisl condimentum.</p>
     <div class ="code-background">
      <code>for (let sugar = 0; i < 5; i++) {<br>
        function sugarAmount (faceRead, spoonGrams) {<br>
        .....} <br>
        }<br>
        return sugar; 
      </code>
    </div>
  </section>
  <section id = "Scientific_Laboratory" class ="main-section">
    <header>
      <h2>Scientific Laboratory</h2> 
    </header>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Penatibus et magnis dis parturient montes nascetur ridiculus mus. Libero nunc consequat interdum varius sit. Netus et malesuada fames ac. Felis bibendum ut tristique et egestas quis ipsum.</p>
    <div class ="code-background">
      <code> let keepAlien == true;<br>
      crewDecision != true ? keepAlien == true : keepAlien == true;</code>
    </div>
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Penatibus et magnis dis parturient montes nascetur ridiculus mus. Libero nunc consequat interdum varius sit. Netus et malesuada fames ac. Felis bibendum ut tristique et egestas quis ipsum.</p>
  </section>   

</main>

Your browser information:

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.4 Safari/605.1.15

Challenge: Build a Technical Documentation Page

Link to the challenge:

using your code this test passes for me

Thank you for checking ilenia. I keep searching for a missing ‘/’ or a missing quote that would throw it off. If no one can find an issue, where should I report this? I’d love to turn in my work or get a more experienced pair of eyes on this. All feedback very appreciated!

please try first with a different browser

Ah ok! that was it! Thank you! So, to anyone else who might have that issue, I was able to pass all the tests using Chrome.

Cheers and thanks ilenia.