@Hassiai
Posted
To center a content on a page, add min-height:100vh; display:flex; align-items-center: justify-content: center; to the body. There is no need to give .container positon: absolute and its properties, and a height value for the desktop and mobile design. Give the .container a width value and a border-radius value. Add backgroundcolor: hsl(white); a padding top and bottom value to the .right-side. since you declare display:flex in the body there is no need to give the flex-items .right-side and .left-side a float value instead of .right-side .sale-price use .sale-price, this will style the same text. Since you have already specify display: flex; in .price, there is no need repeat it in .og-price. use display: inline-block instead of display: flex and its properties in the styling of button Use rem or em as unit for the padding , margin and preferably rem for the font-size for more on this watch this https://youtu.be/N5wpD9Ov_To Hope am helpful HAPPY CODING
Marked as helpful
@imRanDan
Posted
@Hassiai Thank you for taking the time to review my project and for the constructive feedback! I went into my code and implemented all the things you mentioned. It is all looking so much better (in the codebase especially). I greatly appreciate that Kevin Powell video too. I can put something together, but at times it can get messy.
This advice was incredibly helpful! Thanks again! :D