Skip to content
Submitted about 2 years ago

Single price grid component

accessibility
Abdelrahman•90
@Dribbz
A solution to the Single price grid component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

Hi there 👋🏼, I’m Dribbz and this is my solution for this challenge. 🚀

🛠️ Built With:

⚡️HTML5 ⚡️Vanilla CSS

Any Suggestions On how to improve my code is Welcomed 🙌🏼

Thank you !✌️

Code

Please log in to post a comment

Log in

Community feedback

  • Vanza Setia•27,715
    @vanzasetia

    Hi, Dribbz! 👋

    A couple of suggestions:

    • No extra element: You do not need an extra <div> element—<div class="grid-container">—to wrap all the card sections. You can use the <body> element as the grid container of the card or the <main> element. Then, use the <main> element as the .grid-container.
    • Use appropriate element: The content below the "Why Us" text is a list of reasons, so you should use a list element.
    • Remove default styling: By default, <p> elements will have font-size: 1rem. You can remove font-size: 1rem from the .description styling.

    I hope my suggestions help you. Have fun 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