ContextQMD
Back to Freecodecamp

Step 1

curriculum/challenges/english/blocks/workshop-tailwind-pricing-component/686383abac6c625a84458ea9.md

latest954 B
Original Source

--description--

In this workshop, you will learn more about Tailwind CSS by using its grid utility classes to build a pricing component.

The basic HTML boilerplate has been provided for you. Start by creating an h1 element with the text Choose your listening plan.

--hints--

You should create an h1 element.

js
assert.exists(document.querySelector("h1"));

Your h1 element should have the text Choose your listening plan.

js
assert.equal(document.querySelector("h1")?.textContent, "Choose your listening plan");

--seed--

--seed-contents--

html
<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Music App Pricing</title>
    <script src="https://cdn.tailwindcss.com"></script>
  </head>
  <body>
    <main>
    --fcc-editable-region--
    
    --fcc-editable-region--
    </main>
  </body>
</html>