Skip to content
Submitted about 1 year ago

Responsive preview card component using Tailwind

bacoder1•190
@bacoder1
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Product preview card component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

This is my second time using tailwind css, so i chose a small project again to try out responsive designs.

This was build mobile first.

It is my first responsive design, so feel free to judge the code and tell me what i could do better.

Community feedback

  • P. Ricardo•2,370
    @pRicard0Posted about 1 year ago

    Just a small tip

    • Instead of using the tag <span> with the text "$149.99", you can use the <em> tag. The <em> tag is used to define emphasized text. The content inside is typically displayed in italic. A screen reader will pronounce the words in <em> with an emphasis, using verbal stress.
    0

Please log in to post a comment

Log in with GitHub

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord