Build a Bookstore Page - Step 18

HTML-CSS
1

Tell us what’s happening:

Step 18…
I have placed the p element below the element with a class of card-container.

Your code so far

<html lang="en">
<head>
  <meta charset="UTF-8" />
  <title>XYZ Bookstore Page</title>
</head>

<body>

<!-- User Editable Region -->

  <h1>XYZ Bookstore</h1>
  <p>Browse our collection of amazing books!</p>
  <div class="card-container">
       <p>Review your selections and continue to checkout.</p>
      <div class="btn-container">
    <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>


<!-- User Editable Region -->

</body>

</html>

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/26.2 Safari/605.1.15

Challenge Information:

Build a Bookstore Page - Step 18

2

You have actually placed it below the opening tag of the element with a class of .card-container.

Remember, an HTML element has both an opening tag and a closing tag.

3

tx for reply

so the card-container element should have a closing tag DIRECTLY after it??

tx

4

no, the card-container already has a closing tag after all its content, and you need to add the new element after the already existing closing tag

5
6

that’s where I’m at..

tx

7

the link to the challenge is already present in the first post in the part automatically created

this is the card-container element, if you look there is a lot of stuff inside card-container that you added in the last few steps. You could go back a few steps if you are not following, notice how you always add stuff inside card-container since step 8 (it was created in step 7)
and then after all the stuff added inside it there is a closing tag, that is the closing tag belonging to card-container, to add elements after card-container you write after that closing tag

8

Tx let me try your suggestion. And go back a few steps

9
10

I have it below the class of card container outside the closing tag and still NOT able to pass!

tx

11

Please post your updated code if you need more help.

12

…

13

please post your code, not the link to the challenge, you have already share the link to the challenge

we can’t see your code there

16

this is the .card-container element, why are the new elements inside it still?

17

is </div>

Not the closing tag for “card-container”?

18

let’s try to see it like this

image
image968×715 73.6 KB

I linked together with a red line the start tag and end tag of the element with class=“card-container”, can you see now where it ends?

19

there are many </div>, only one of them is the closing tag of the one with card-container

20

I see. One question: is there TWO div closing tags at the end now?? where your red line ends??

tx

21

there is two, because one is closing the dov with id="dave-cooking'book", but only the one linked with the red line is for card-container

22

image
image968×715 74.5 KB

now the opening and closing tag of other elements are also linked together

1 Like