Responsive product preview using CSS and HTML

Hi Bassem 👋. Congratulations on successfully completing the challenge!🎉

just a couple of suggestions

HTML

• for your whole container it's better to use <main> tag instead of a <div>.main tag is an HTML5 tag which is supposed to represent the main content of website. it's better for SEO purposes. you can check this 👉MDN

CSS

• if you want to center the whole content of your page horizontally and vertically using display flex for body is the best choice, like the code below..

body {
min-height: 100vh;
display: flex;
align-items: center;
justify-content: center;
}

• (*) is a universal selector and it is used to give universal styles to all elements. if you use font-weight and background-color in this universal selector it means that it gets apply to all elements of the page. try to do this..

body {
font-weight: 300;
background-color: rgb(227, 224, 224);
}

Anyway your solution is great🙂

I hope you find it useful😊