Order Card Component solution using HTML and CSS

Hey Promise You did amazing work congratulations for completing this challenge

-- to fix accessibility issues :

• use <main</main> and wrap inside it <div class="container"></div> so all page content should be contained by landmarks.

-- To make your code more Responsive

• don't give section or div specific height that will damage the responsivity in mobile if width of screen small so remove height and use min-height instead .

• use <a href="#"> cancel order</a> instead <p>cancel order </p> to make it more semantic

• you can use variables in css and save colors or fixed sizes in variables like this :

:root 
{
--main-color:#3829e0;
--font-family:'Red Hat Display',sans-serif;
}

h1 
{
font-family:var(--font-family)/*to call  value of the variable*/
}

• you can comment footer section in this challenge to get more awesome view

You used semantic class names and id so code is readable and this awesome

Regardless You did amazing I hope this is useful to you... Keep coding👍