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

Mobile first Single price grid component

scary developerβ€’ 155

@snake325

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


Pls give me feedback because your feedback will help me to improve my coding skills

Community feedback

Nitin Panwarβ€’ 160

@nitinpanwar08

Posted

Hi , Good job on this challenge, it is very responsive and overall looks great

Keep contributing these awesome solutions πŸ”₯ & Happy Coding πŸ˜‡

1

scary developerβ€’ 155

@snake325

Posted

@nitinpanwar08 Thank for your feedback

0
P
Graceβ€’ 27,870

@grace-snow

Posted

Hi,

This looks pretty good. I'd reduce the max width a little and let the content be 90% wide as it goes very narrow on my mobile.

A few tweaks needed on your HTML, but all very easy to fix:

  • You can't have a link inside a button. Just use a link and style it to look like a button
  • The lower two boxes should have h3 headings, not h2 because they all belong to the 'Join our comunity' section of the page.
  • Similarly the price in dollars shouldn't be in a heading tag, but if it was, it belongs to the directly preceeding heading so would need to then be a h4
  • The content under 'why us' should really be a list, not a single paragraph

I hope those are helpful tips for you (please upvote if they are to let me know :) )

1

scary developerβ€’ 155

@snake325

Posted

@grace-snow Thank you so much for your feedback and thanks to tell me my mistakes Your feedback is very helpful for me and it's my request to you @grace-snow when ever I share my solution pls give your feedback . again thank you so much and your this feedback is very helpful

1
P
Graceβ€’ 27,870

@grace-snow

Posted

@snake325 this looks good now. I think you're misunderstanding what the main element is for in html though. Main is to wrap whole page content after a header, not really for use like this.

0
Kyrylo Lvovβ€’ 160

@kyrylolvov

Posted

Hey! πŸ˜€

Looks great to me! πŸ†

The component is completed based on the design provided and is optimized for all of the resolutions. πŸ™‚

0

scary developerβ€’ 155

@snake325

Posted

@kyrylolvov Thanks for your feedback

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