Skip to content
Submitted about 2 years ago

3 Column preview card component using SASS

Michal Bednář•140
@MichalBednar
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...3-column preview card component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

This was pretty fast project for me, I feel like I'm getting better at css. I have a question, is it possible to make the code shorter?

Community feedback

  • バレンタイン 😈•64,170
    @VCaramesPosted about 2 years ago

    Hey @MichalBednar, some suggestions to improve you code:

    • You want to wrap the entire thing an an Article Element.
      <body>
      <main>
        <article>
          <article class="sedan-card"></article>
          <article class="sedan-card"></article>
          <article class="luxury-card"></article>
        </article>
      </main>
    </body>

    • The car images/icons serve no other purpose than to be decorative; They add no value. Their Alt Tag should left blank and have an aria-hidden=“true” to hides it from assistive technology.

    • The headings are being use incorrectly. For this challenge, each heading is equally as important. So best option, is to use <h2> Heading, because it will give each card the same level of importance and it's reusable.

    Happy Coding! 👻🎃

    Marked as helpful
    0
    Michal Bednář•140
    @MichalBednarPosted about 2 years ago

    @vcarames Thank you, I will change the code so it suits!

    0
    バレンタイン 😈•64,170
    @VCaramesPosted about 2 years ago

    @MichalBednar

    Glad I could help!

    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