Skip to content
Submitted over 2 years ago

production preview card

Judith•40
@Sefure91
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Product preview card component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

The most difficult part is to make it responsive for mobile and monitor. I tried many solutions I found on the webs, none of them seem to work. I'm not sure where I did go wrong there.

Community feedback

  • Martin•450
    @mvelardeqPosted over 2 years ago

    Good job Judith, in order to show the border radius of images, you must use overflow:hidden in image selector, then you have to use class selector intead of id selector in css, id selectors are used for javascript. For responsive design you have to change the flex direction of card component of row to column in 600px breakpoint (if the width of card is almost less width than 600px). Sorry for my bad english xD

    Marked as helpful
    1
    Judith•40
    @Sefure91Posted over 2 years ago

    @mvelardeq 😅 thank you very much. Your English fine, I understand it 🤷🏻‍♀️ And woops played with JavaScript too much I guess 😂

    0

Please log in to post a comment

Log in with GitHub

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