@zacc-anyona
Posted
Hello Danielle, You have done a really great job in taking your time to finish this challenge. But there are a few areas you can improve on.
-
You don't have to use multiple media queries for such a project. Using a mobile-first workflow will help you escape the hell of multiple media queries. What am I saying? HTML elements are naturally responsive, so you could start out by reducing the size of the browser window to resemble the size of a mobile screen. Then code out the HTML elements to conform with the mobile design. Then later on you can use one
min-width
media query to complete the desktop design. This post on media queries will help.. -
Always use modern CSS reset. It will help you with the image shrinking issue. This article will get you up to speed with the latest modern CSS reset..
-
There is a better and simple way of centering contents without the use of too much CSS code.
body {
min-height: 100dvh;
display: flex:
flex-direction: column;
justify-content: center; /*centers horizontally*/
align-items: center; /*centers vertically*/
Generally you have done a great job. If you find my comment helpful don't forget to mark it as helpful and give me an upvote.
Marked as helpful