@pikapikamart
Posted
Hey, great work on this one. The layout both in desktop and mobile is good. It resizes well also when going in mobile state.
A couple of suggestion/s;
-
Body. In your
body
tag, you declaredwidth: 100vw
and that is the cause of the appearance of scrollbar at the bottom. Removing will be really good. Also remove theheight: 100%
in it as well, because if you inspect it at dev tools, yourbody
tag does not really captures the whole layout because it is limited to 100% of its parent, referring to the viewport. Remove that so that it will capture the elements. -
Color. In your grid section, the color of the font that you are using is somewhat grey. So if you blend it in the background, the contrast is very low. Use a more white-ish of a color so that it will be easy to read and adding some overlay in those images, to make them a little bit dark, just a touch, just to make the text pop out more.
Well that's all. Overall you did a really good job^^
@Gesiere
Posted
@pikamart thank you for the feedback, will look into what you said.
@Gesiere
Posted
@pikamart but how do you suggest that I set up my body and html elements anytime I start a project.
@pikapikamart
Posted
@Gesiere Hey, well my everyday temple is this
html {
box-sizing: border-box;
font-size: 100%;
}
body {
margin: 0 auto;
min-height: 100vh;
padding: 0;
}
*,
*::before,
*::after {
box-sizing: inherit;
}
That is my base. But always keep in mind. Avoid using height: 100vh
in your body okay. Do not use that, let the element give the body the dimension that it needs^^
@Gesiere
Posted
@pikamart Thanks so much, I really appreciate.