Tell us what’s happening:
I’m not sure I understand the instructions. The two elements are ‘siblings’ and ‘card’ is inside ‘card-container’ Are the elements not supposed to be right next to each other?
Your code so far
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>XYZ Bookstore Page</title>
</head>
<body>
<h1>XYZ Bookstore</h1>
<p>Browse our collection of amazing books!</p>
<div class="card-container">
<!-- User Editable Region -->
<div class="card-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>
<!-- User Editable Region -->
</div>
</body>
</html>
Your browser information:
User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/142.0.0.0 Safari/537.36
Challenge Information:
Build a Bookstore Page - Step 13