Skip to content
Submitted almost 4 years ago

Semantic HTML5 markup - CSS custom styling. - Flexbox - Mobile-first

Asiimawe•150
@Pablo-cyber21
A solution to the Order summary component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

My first challenge on frontend mentor. All advice and critic are very much welcome. Qn. -How can I align the music svg icon with the rest of the elements on the Annual pricing section ?

Code

Please log in to post a comment

Log in

Community feedback

  • Nguyen Duy•245
    @koalalikecode

    Hey Asiimawe, congrats on your first challenge. I think you have grasped a basic use of HTML and CSS, but you need to practice more on your next challenge.

    • Firstly, your card is too big compared to the design, you can css your card class with max-width: ...;background-color: white; and have your img in it and the container class with max-width: 100%. You can try these codes.
    • Secondly, your background image should have css that background-repeat: none; to remove the default value.
    • Try to use your h tag respectively, such as h1 -> h2 -> h3
    • Finally, try to make your solution close to the design as much as you can.

    Happy coding!

    Marked as helpful

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