Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Product Review Card Component

@prithvivarma-nallapuraju

Desktop design screenshot for the Product preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

@G87git

Posted

Great Prithvi Varma Nallapuraju, but it's seems likes your left-side-img contains all the height meanwhile on the challenge it's not...🤔 By so doing, you can add a little bit of height to the container and margin or padding around the x-axis of text-container will make the site look more accurate to the design

Marked as helpful

0

@prithvivarma-nallapuraju

Posted

@G87git

Thanks for posting your comment Nzangmene Hassan. That's very useful. I just started learning tailwind CSS today and this is the first project that I've done by myself.

0
S MD suleman 3,530

@sulemaan7070

Posted

hey Prithvi Varma Nallapuraju😄, congratulations on completing the challenge.. here are a few things you can do to make your site look the best..

  1. it as always a best practice to use the picture element.
<picture>
  <source media="(min-width: 650px)" srcset="img_food.jpg">
  <source media="(min-width: 465px)" srcset="img_car.jpg">
  <img src="img_girl.jpg">
</picture>

find more about it here.

2.the image seems streched on the desktop version, you can add object-fit:contain.

3.Add a little bit of height to the container and margin or padding around the x-axis of text-container will make the site look more accurate to the design...

4.and on hover of the button you can change to darker color which you will find in the style.md file happy coding💯🎉🎉

Marked as helpful

0

@prithvivarma-nallapuraju

Posted

@sulemaan7070

Thank you for posting your comment S Md Suleman. That's very useful. I will learn about these a bit more. I just started learning tailwind CSS today and this is the first project that I've done by myself.

1

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord