Submitted about 1 year ago
Responsive page using only HTML5 and CSS Flexbox
@ggfarias
Design comparison
SolutionDesign
Solution retrospective
First Solution here, feel free to leave a comment! :)
Community feedback
- @pRicard0Posted about 1 year ago
Vim aqui retribuir o favor já que vi que é BR.
Algumas dicas HTML
- É recomendado que você siga as hierarquias dos titulo e utilize h1 ao invés do h2. Enquanto não tiver usado h1, não usa h2, enquanto não usar h2, não usa h3 e assim por diante.
- É bom mudar o nome das tags para ter um HTML mais semântico e em projetos em larga escala te ajudar a se encontrar no meio de tanto texto. Por isso... é bom utilizar a tag main ao invés de uma div com a classe "content-container". Se quiser dica de atalho, só clicar F2 com o mouse em cima da div e digitar "main" que atualiza tanto a abertura quando a fechadura da tag.
Algumas dicas em CSS
- É possivel melhorar um pouquinho teu site. Geralmente em links eles tem uma animação para aparecer uma linha em baixo, é bom aplicar isso no teu código. Faz assim... na parte
.attribution a { color: var(--grayish-blue); }
adiciona
text-decoration: none;
e depois disso adiciona o hover.attribution a:hover { text-decoration: underline; }
O "hover" é para dizer o que acontece com aquele elemento quando o mouse passar por cima.
Marked as helpful0 - @SaeedAlsayedPosted about 1 year ago
Hello Nice Work,
To prevent scroll without no meaning and set the height to 100vh
you need to do this code
*{ margin:0; padding:0; }
Marked as helpful0@ggfariasPosted about 1 year ago@SaeedAlsayed Thank's Saeed, didn't notice that!
I'll update the code
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