Design comparison
Solution retrospective
as easy as pie
Community feedback
- @AdrianoEscarabotePosted about 2 years ago
Oi Cauê Souza, tudo bem?
Gostei muito do resultado do seu projeto, mas tenho algumas dicas que acho que você vai gostar:
Como você sabe, este projeto é baseado apenas em um componente de página, portanto, não é necessário h1! pois não sabemos se esta página terá um componente mais importante, mas é sempre bom prevenir erros de acessibilidade então acho que seria bom você adicionar um
h1
nesse componente, além de ser uma boa prática para quando você está desenvolvendo sites maiores, não se preocupe, esqueça oh1
.main { min-height: 100vh; }
Use
min-height
em vez deheight
, pois quando o conteúdo for além demain
o conteúdo acabará sendo ocultado! faça o teste aumentando a altura do article!o resto é ótimo!
espero ter ajudado... 👍
0@cauesooouzaPosted about 2 years ago@AdrianoEscarabote fica tranquilo que questão de acessibilidade e seo, esta bem otimizado, e enquanto ai height, não faz diferença pois se fosse uma pagina com outros elementos, nao seria feito dessa forma utilizando 100vh, ele seria em tamanho relativo, ocupando somente o espaço necessario, o 100vh foi utilizado somente para questões de centralização, obrigado pela sua ajuda mas não é necessario alterações
1 - @AltairCGSPosted about 2 years ago
To properly center your content to your page, you will want to add the following to your Body element (this method uses CSS Grid):
body { min-height: 100vh; display: grid; place-content: center; }
A little advice that they gave me before :3 I hope this helps! Keep up the good work!
0@cauesooouzaPosted about 2 years ago@AltairCGS ins't a good a idea give height to body... when you need to center a element in axis x use:
margin: 0 auto;
when you need to center a element in axis y use: flexbox0
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