Skip to content
Submitted almost 2 years ago

Product preview card component

Christian Novo Sacramento•20
@cnsacramento
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

Hi, I'm Christian and this is my solution to this challenge.

Comments are welcome

Help:

I was dealing with the semantic tags section and article and finally used article, I've read a lot about it, but the more I read it the less I understand it. I only know if the content can stand alone, it's an article and a good tip to notice if the content is a section is if you can include it in an outline, but I'm not sure when to use it I also know that a section has to have a header.

I would like to know if I am doing some bad practice and how I can improve my css and html semantics.

Community feedback

  • Tux3er•780
    @Tux3er-IsmaPosted almost 2 years ago

    Hi Christian!!!

    Congrats completing this challenge and also for having a great code 👍🏻🎉

    I will give you some tips for your next project 💡:

    • Your css reset is good but I recomend you another css reset: normalize.css 🎨

    • When you are creating variables in css don't put it in * selector put it in :root

    • Use some hover effects, like changing the background-color of the button. You can get this by putting the btn class and then you add :hover. Also use cursor: pointer and a transition

    • Don't put two html files only put one index.html🦴

    • Don't forget to quit the comment in the <footer></footer>

    That's all. Your HTML semantic looks great and all your code too!!!👍🏻🌟

    I hope this will be helpful to you in the future 😉

    Happy coding ⌨️🖐🏻!!!

    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