Submitted over 1 year ago

Product Preview Card Component

vite, sass/scss

Aphelion Web Development•120

@Aphelion-im

A solution to the Product preview card component challenge

Preview Code

Solution retrospective

The result is quite good on my desktop pc.

However, on my mobile and in Chrome dev tools/Firefox dev tools (On mobile view), a part of the top of the site is seemingly cut off.

I watched this Youtube video with Kevin Powell explaining the vh unit, and some other units to solve the problem, but that didn't help.

https://www.youtube.com/watch?v=veEqYQlfNx8 (Kevin Powell, The problems with viewport units)

On ipad, the product card, seems to vertically stretched, so the text on the right gets too much white space.

Code

Please log in to post a comment

Community feedback

No feedback yet. Be the first to give feedback on Aphelion Web Development's solution.

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