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
Desktop design screenshot for the Age calculator app coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Community feedback

@Blackpachamame

Posted

Greetings! you have done a great job 😎

I want to make some suggestions to you:

  • Perhaps if you apply the following properties to the arrow you can make it more centered: left: 50% and transform: translateX(-50%). Then, you will adjust the % as it seems to be more to the center.
  • I don't understand the margin-top in the body, it doesn't seem to be necessary
0

@saykate

Posted

@Blackpachamame

Thanks for the feedback!

The margin-top on the body was so that the card isn't stuck to the top of the page. Is there a better way to achieve that? Is it better practice to use padding?

What is the issue with the arrow? From my end it seems to match the design, but maybe it's not showing up the same for you? Or maybe you're trying to tell me something I'm not understanding? Super open to hearing more!

Thank you so much for looking at my code!

0

@Blackpachamame

Posted

@saykate

  • The margin-top is not necessary if you already have the padding to fulfill that function
  • I apologize, I didn't give many details, but with the arrow I meant that in the mobile version, the circle with the arrow is not really seen in the center, which in my opinion is where it should be according to the design.

But this is nothing more than my assessment, I could be wrong or we simply see it differently haha

0

@saykate

Posted

@Blackpachamame

Awesome, and oh my gosh, I did not see how off-centered it was in mobile! I made tweaks and didn't check the mobile-view after!

Thank you!

1

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