All solutions

What are you most proud of, and what would you do differently next time?

what would i do next time is to ensure to apply KISS principle (Keep It Simple Stupid) + i would look for different approaches to minimize the css

What challenges did you encounter, and how did you overcome them?

I watched kevin powell video he says that on front end mentor do something extra something that is cool so I implemented the svg that is under the type of the product plus switching products functionality. the layout is super simple i finished it in less than a day but the responsive part was a bit challenging

What specific areas of your project would you like help with?

i know there is problems with the CSS but i'm asking you to review the code and tell me every single small detail that i made badly and how i can improve it , what i need to learn more

What specific areas of your project would you like help with?

This is challenge is pretty easy but there is something that i don't know about in the text especially the last paragraph , now ofc i used text-wrap property to make it look exactly like the layout but i tried and nothing works , i looked for word-break property but it doesn't do anything , the last paragraph is looking good because of text-wrap : balance but if you checked the original layout you will see that the second line is longer than the first and only three words on the third line , so i partially fixed it by using balance text wrap and then applied a `` , but this makes the last paragraph aligned with the above one i have no idea why. any ideas why this happened?

What specific areas of your project would you like help with?

spacing between elements is done using paddings , i don't know if it's the right solution or not for spacing , can someone review and tell me what is the right approach for spacing?

What are you most proud of, and what would you do differently next time?

maybe the 100dvh on the body trick i will try to explore it more later

What challenges did you encounter, and how did you overcome them?

centering the card vertically , I knew it can be done with flexbox and grid but i tried for so long to do it without even thinking about felx or grid or even absolute positioning until a true legend on discord told me to to put 100dvh at the body i don't know what is it but i will explore it and yeah i had to put flexbox .

What specific areas of your project would you like help with?

• dealing with images in css for me was so hard and so weird i don't even know what max-width:100% thing do but i will search more on it
• Controlling the size of the image was hard
• Positioning of the card was a bit of headache
• Need more general rules or a way of thinking that makes css designing less complex for me