Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

Single price grid component

Roxanne 260

@rox-stahl

Desktop design screenshot for the Single price grid component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Version 2.0!

Community feedback

@VCarames

Posted

Hey there! 👋 Here are some suggestions to help improve your code:

  • There are three headings in this component; “Join our community”, “Monthly Subscription”, and “Why us”. They need be wrapped in a header element.

  • The “Why Us” list should be created using an Unordered List Element along with the List Items Element.

  • The Article Elements are being used incorrectly. In order to use the Article Element the components need to be able to make sense on its own and be independently distributable (can be used in on another site).

  • I noticed that you placed the "Monthly Subscription" and "Why Us" in a container together, what was the reason for this? The CSS grid would of still placed them in the correct place?

  • At 375px, "Monthly Subscription" and "Why Us" text lose their styling.

If you have any questions or need further clarification, let me know.

Happy Coding! 👻🎃

Marked as helpful

0

Roxanne 260

@rox-stahl

Posted

@vcarames I see now 🤦🏻‍♀️ I had not been exposed to .wrapper until now (thank you!). I think I'm too worried about accessibility and labeling that I forget that it's not needed all the time. I thank you for your help and detailed explanations.

0

Please log in to post a comment

Log in with GitHub
Discord logo

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