I can’t get past Step 15. After checking my code I get an error:
// running tests
2. Your new p element’s text should be Review your selections and continue to checkout..
// tests completed
I have even copied the text to make sure I didn’t misspell anything.
Your code so far
<!-- User Editable Region -->
<h1>XYZ Bookstore</h1>
<p>Browse our collection of amazing books!</p>
<div class="card-container"></div>
<div class="card" id="sally-adventure-book">
<h2>Sally's SciFi Adventure</h2>
<p>This is an epic story of Sally and her dog Rex as they navigate through other worlds.</p>
<button class="btn">Buy Now</button>
</div>
<div class="card" id="dave-cooking-book">
<h2>Dave's Cooking Adventure</h2>
<p>This is the story of Dave as he learns to cook everything from pancakes to pasta, one recipe at a time.</p>
<button class="btn">Buy Now</button>
</div>
<div class="card-container"></div>
<p>Review your selections and continue to checkout.</p>
<div class="btn-container"></div>
<!-- User Editable Region -->
Your browser information:
User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/143.0.0.0 Safari/537.36
you have created this but you were not asked to create this, there is already an element with class="card-container" and the description is referring to that, so this new one could be messing with the tests
<!-- User Editable Region -->
<h1>XYZ Bookstore</h1>
<p>Browse our collection of amazing books!</p>
<div class="card-container"></div>
<div class="card" id="sally-adventure-book">
<h2>Sally's SciFi Adventure</h2>
<p>This is an epic story of Sally and her dog Rex as they navigate through other worlds.</p>
<button class="btn">Buy Now</button>
</div>
<div class="card" id="dave-cooking-book">
<h2>Dave's Cooking Adventure</h2>
<p>This is the story of Dave as he learns to cook everything from pancakes to pasta, one recipe at a time.</p>
<button class="btn">Buy Now</button>
</div>
<div class="card-container"></div>
<p>Review your selections and continue to checkout.</p>
<div class="btn-container"></div>
<!-- User Editable Region -->
When I remove the 2nd part of the coding then I get 2 errors. But if I leave both coding in there I only get 1 error saying “Your new p element’s text should be Review your selections and continue to checkout.” Which it does say that.
*****Forgive me for my forum usage. I am new to this.
I’ve edited your post to improve the readability of the code. When you enter a code block into a forum post, please precede it with three backticks to make it easier to read.
You can also use the “preformatted text” tool in the editor (</>) to add the backticks.
There’s an existing card-container div on line 3. (Closed on line 15).
You’ve added another new card-container div on line 15, but the instructions don’t ask you to do that.
<h1>XYZ Bookstore</h1>
<p>Browse our collection of amazing books!</p>
<div class="card-container"></div> <!--here is is! But you've closed it?
this div is the card container, so it should CONTAIN the cards
between the opening and closing divs
now the cards come AFTER it. -->
<div class="card" id="sally-adventure-book">
<h2>Sally's SciFi Adventure</h2>
<p>This is an epic story of Sally and her dog Rex as they navigate through other worlds.</p>
<button class="btn">Buy Now</button>
</div>
<div class="card" id="dave-cooking-book">
<h2>Dave's Cooking Adventure</h2>
<p>This is the story of Dave as he learns to cook everything from pancakes to pasta, one recipe at a time.</p>
<button class="btn">Buy Now</button>
</div>
<div class="card-container"></div> <!--this is a NEW card container you were not instructed to create-->
<p>Review your selections and continue to checkout.</p>
<div class="btn-container"></div>
You should reset and try again.
Add the new P AFTER the card container div is closed.
If you click on the opening tag of the div, the closing tag will be highlighted so you can easily see where it ends.
