Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Only Css Flexbox

#accessibility
Desktop design screenshot for the 3-column preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


I hope everything is ok. As always, I welcome suggestions.

Community feedback

Lucas 👾 104,580

@correlucas

Posted

🤓Oi de novo Tathi. Parabéns pelo seu novo desafio!

Acabei de abrir seu código pelo celular, e você construiu muito bem essa solução, gostei que você usou tag semânticas. Bem avançado.

Pra melhorar seu CSS você pode aplicar classes para elementos que se repetem, por exemplo os 3 cartões e uma classe pra mudar somente as coisas que são diferentes em cada um, como a cor. Desse jeito você tem o controle de 3 elementos com uma classe só.

Seu componente ficou ótimo, só faltou aplicar um media query pra deixá-los em vertical. Você pode usar a media query com flex-direction: column; por exemplo.

Depois faz o teste pra você ver.

Parabéns e continue no foco 👏

Marked as helpful

0

Please log in to post a comment

Log in with GitHub
Discord logo

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