Build a Page of Playing Cards - Build a Page of Playing Cards

HTML-CSS
1

Tell us what’s happening:

I keep getting the “You should have at least three div elements with a class of card within your #playing-cards element.” message . What am i doing wrong?

Your code so far

<!-- file: index.html -->
<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Playing Cards</title>
  <link rel="stylesheet" href="styles.css">
</head>

<body>
  <main id="playing-cards">
   <div classs="card">
     <div classs="left">♠</div>
      <div classs="middle">A</div>
        <div classs="right">♠</div>
       </div>
   
    <div classs="card">
     <div classs="left">♣</div>
      <div classs="middle">3</div>
        <div classs="right">♣</div>
       </div>
   
   <div classs="card">
     <div classs="left">♥</div>
      <div classs="middle">5</div>
        <div classs="right">♥</div>
       </div>
   
     
      
    </main>
</body>

</html>

/* file: styles.css */
#playing-cards{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:20px;
}

.card{
  display:flex;
  justify-content:space-bettween;
}

.left{
  display:flex;
  align-self:flex-start;
}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/148.0.0.0 Safari/537.36 Edg/148.0.0.0

Challenge Information:

Build a Page of Playing Cards - Build a Page of Playing Cards

GitHub Link: freeCodeCamp/curriculum/challenges/english/blocks/lab-page-of-playing-cards/66be24cb4144f955b6bcc550.md at main · freeCodeCamp/freeCodeCamp · GitHub

3

double check your attribute names

6

HA! Such a silly mistake. Thanks