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

Responsive single price page using CSS grid

Aghnia 30

@aghniputra

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


Hi, this is my very first project. I'm not really sure about the code I wrote for the responsive so it displays the mobile page properly. I'd be happy to hear all your feedback. Thank you :)

Community feedback

P
ApplePieGiraffe 30,545

@ApplePieGiraffe

Posted

Hello, Aghnia! 👋

Congratulations on completing your first Frontend Mentor challenge! 🎉 Great work on this one! 👍

Here are a few things I'd like to suggest,

  • Not wrapping a button element inside a link element. An element should either only be one or the other. In this case, I think the "Sign up" element would be good to be a link since elements of that sort typically take you to a sign up/login page. 😉
  • Adding a favicon to the site. There should be one in the starter files for this challenge that you can use.
  • Avoiding using px for setting the value of font-size in your styles. Instead, use a responsive unit such as em or rem so that users will be able to change the size of the text in your site by changing the default font-size of their browser. It might also be worth setting the values for other properties such as margin or padding in those units so that your entire site will scale with the user's chosen default font-size. If you'd like to learn more about those units in CSS and how all of this works, check out this helpful video on the topic.

Hope you find these suggestions helpful. 😊

Keep coding (and happy coding, too)! 😁

Marked as helpful

2

Aghnia 30

@aghniputra

Posted

Hi @ApplePieGiraffe, thank you so much for your suggestions and the video :)

1
P
ApplePieGiraffe 30,545

@ApplePieGiraffe

Posted

@aghniputra

No problem! 😊

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