Skip to content
Submitted over 3 years ago

Mobile First 3-Card Component Solution (CSS, Flexbox)

Nicki•170
@Nickil13
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

Hi everyone!

This is the first FEM challenge I've done and I really enjoyed working on it.

I'm happy with how it turned out, although I felt that my CSS got repetitive when I did the sections and buttons. Is there a better way to handle classes with similar styles?

Any feedback is greatly appreciated!

Community feedback

  • Franziska Wich•210
    @franziskawichPosted over 3 years ago

    Hi Nicki,

    welcome and congratulations on your first challenge. Looks great. (:

    To prevent repetitive code you could add just another class on each element you use the same properties on, e.g. class="card card-sedan" (card card-suv / card card-luxury) and then fill that first class with everything you would like to have on all your elements. Use the second class for individual properties.

    Happy coding~

    1
    Nicki•170
    @Nickil13Posted over 3 years ago

    @franziskawich Thanks so much!

    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