Skip to content
Submitted over 3 years ago

Order summary component

Chloe gabriel•40
@chloeGabriel
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...Order summary component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

Hi there,

I finished recently web dev courses and I'm eager to practice more my CSS and HTML. If you can give me your opinions on the code part, how I can improve it, or make a clean code feel free to tell me.

Community feedback

  • Chamu•13,130
    @ChamuMutezvaPosted over 3 years ago

    There are some issues raised in the report, some of them can be solved by using the semantic element main. Replace the div with the class of card with the main element. Make the div with the class of attribution be a footer element. Use semantic elements where ever possible

    Marked as helpful
    0
  • Mojtaba Mosavi•3,760
    @MojtabaMosaviPosted over 3 years ago

    1- Add a alt attribute to the card image, set it to an empty string because the image is on the page for only decorative reasong.

    2- Add some padding to the card on the mobile view so doesn't touch the edges of the viewport.

    Keep coding :=)

    Marked as helpful
    0
    Chloe gabriel•40
    @chloeGabrielPosted over 3 years ago

    @MojtabaMosavi thank you ! You help me a lot :D

    0
  • Ahmed Faisal•5,095
    @afrusselPosted over 3 years ago

    Overall good work except some issues. Most of those are already posted. Use rem for font-size instead of px

    2

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