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

nft_preview_card_component (#html + #css)

@LucianoOliveira1

Desktop design screenshot for the NFT preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


English: I'm totally open to criticism and suggestions about the code!

Português: Estou totalmente aberto a criticas e sugestões sobre o código!

Community feedback

Lucas 👾 104,420

@correlucas

Posted

👾Fala Luciano, parabéns pelo seu novo desafio!

Acabei de ver sua solução e achei tudo muito bom, aqui umas dicas pra você melhorá-lo:

1.Usar um valor menor pras bordas arredondadas, não acho que seja tanto como você colocou com 20px, tenta uma valor tipo main { border-radius: 12px;}.

2.Não defina uma altura pro seu container, tudo que você precisa fazer é definir o tipo de display e colocar o max-width se você colocar uma altura pro container isso pode dar problemas com a responsividade, a altura geralmente é criada com os elementos dentro do container e o padding deles.

3.Use max-width ao invés de width dentro do container pra deixar ele responsivo, colocando width o valor do container fica fixo e não pode crescer e nem diminuir.

Espero ter te ajudado e continue no foco!

Marked as helpful

1

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