Skip to content
OverviewSolutions
4
Comments
2
Elijah Littell-Sivley
@CyberNotesDev

All comments

  • Elijah Littell-Sivley•50
    @CyberNotesDevPosted about 1 year ago

    You have an amazing solution, I really like the descriptive class names. I also have a few tips for your future projects if you wouldn't mind hearing!

    1. Use HTML Semantics they help with readability and helps search engines interpret content. You can look at more details here
    2. Have an attention to detail when looking at the design and your current design. For example I see that you've made the sales price span a font-family: 'Montserrat', sans-serif; instead of font-family: 'Fraunces', serif; Its the little things to having the perfect design solution!

    Hope this helps, Happy developing! :)

    1
  • HussainAzimi•120
    @HussainAzimiSubmitted about 1 year ago
    What are you most proud of, and what would you do differently next time?

    I am proud to learned more about responsive design after finishing the challenge

    What challenges did you encounter, and how did you overcome them?

    I encountered Building flexible layouts and overcame it by using Flexbox and media query.

    What specific areas of your project would you like help with?

    Building flexible layouts

    Product preview card component using CSS grid and media query

    1
    Elijah Littell-Sivley•50
    @CyberNotesDevPosted about 1 year ago

    Hi! I love your use of HTML semantics and comments

    Here's a little feedback to help you improve making the design a little closer!

    1. You can align the whole product card to the center by potentially doing body { display:flex; flex-direction: column; justify-content: center; align-items: center; min-height: 100vh} Because since there is only essentially two children in the body (product card and 'challenge done by' div) you'll be able to center it!
    2. Removing the padding in .product {} to give you the perfect solution look!

    Hope this helps! Happy developing! :)

    0