Design comparison
Community feedback
- @correlucasPosted about 2 years ago
👾Fala Nathan, tudo bem? Parabéns pelo desafio!
Eu sugiro você construir esse component com GRID, que é bem mais fácil e pratico. Aqui um passo a passo para construir este componente com 2 colunas tudo o que você precisa fazer é criar um bloco principal para conter todo o conteúdo (você pode usar
<main>
para quebrar), defina seuwidth
comomax-width: 900px
(é o tamanho do contêiner) edisplay: grid
/grid-template-column: 1fr 1fr
(isso significa que seu componente terá duas colunas com 50% da largura do contêiner cada uma é 450px)Para fazer a parte mobile basta aplicar
grid-template-column: 1fr
pra deixar o container mostrando apenas uma div por coluna.👋 Espero ter ajudado e continue no foco!
0 - @JuarrisonPosted about 2 years ago
Hi @Nathan4Andrade. Congratulations on your project. I think you could try some changes to improve the code. First of all, you could explore the semantic tags that HTML has and decrease the use of divs. Here is an interesting link about it: https://www.w3schools.com/html/html5_semantic_elements.asp
On the other hand, the mobile version is not responsive. I suggest that in the mobile version you incorporate the flex-direction: column property along with some changes to the size of the image. Greetings, I hope this comment has been useful to you.
0
Please log in to post a comment
Log in with GitHubJoin 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