glyphs25• 80
@glyphs25
Submitted
Okemwa-mokaya
@Okemwa-mokaya
All comments
- Okemwa-mokaya• 350
@Okemwa-mokaya
Posted
I think for <q></q> adding line-height and increasing font size could help testimonial 5 cover the whole space
Marked as helpful
1 - MarkitoOff• 70
@MarkitoOff
Submitted
Hello ! Here is my second challenge and I am very proud of the result despite the time spent and after doing some research. Now it is your turn to help me since I would like to have some feedback on the project. How can I improve? What good can I add to make the code more readable and consistent and make the site nice to see
Okemwa-mokaya• 350@Okemwa-mokaya
Posted
For product-price since it is a crossed off price you are advised to use <del></del>,you can google to confirm. for product-category CSS does not advise to use capital letters through for PERFUME you could write in small letters in html then in CSS use text-transform and set to uppercase Hope this is helpful
Marked as helpful
0 - 01JohnnyJohn• 30
@01JohnnyJohn
Submitted
The process was quiet linear. I've, first, set HTML structure. Then I've added all the basic CSS like variables for fonts, colors, background-colors, font-families etc, then matched CSS selectors with all the classes I've given while writing HTML
I've been stuck for a while when trying to make the right side of the product card be spread (in height) within its container. I've also been stuck when trying to make both sides take 50% of the main container when screen width is more than 600px. The problem was that I've set max-width: 100% for image to fill its container, that's why it wouldn't scale when setting main container as a flex container. So, I had to overwrite it in media-query.
Okemwa-mokaya• 350@Okemwa-mokaya
Posted
to get a 50% width for both sides you can try using grid, on the container css you could write .container{ display: grid; grid-template-columns: 1fr 1fr; } it will display equal sizes on both sides That is for the desktop display Hope this is helpful
Also for the crossed price you can use <del></del> element. It is highly suggested, you can google it to confirm.
Marked as helpful
0
