Not Found
Not Found
Cannot read properties of null (reading 'code')
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Cannot read properties of null (reading 'code')
Not Found
Not Found
Not Found
Cannot read properties of null (reading 'code')
Not Found

Submitted

Profile card component solution

@Gab-Ferreira

Desktop design screenshot for the Profile card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hello, I have problems with media queries : When I'm doing the code on my pc and I'm watching the result for smartphone with F12, the result is good. But when I publish the page and looking for the result with my phone, the result is horrible. Any suggestions ?

When I wanted to use transform: translate(-50%, -50%) it not worked, my card was somewhere I couldn't see, however I saw on the internet that it was the solution to center a div in the page. I'm lost, any solutions ?

Thank you for your time :).

Community feedback

@Fernando0654

Posted

Avoid using px most of the time. I was checking your code, but I can't find your transform: translate. If you're using this prop, don't forget to add the top and left properties. Otherwise won't work as you expected. Hope this is helpful, good luck!

Marked as helpful

0

@araujoleonardo310

Posted

Hi, Gabferreira's :)

You need to learn about responsive and using DevTools. This video will help you.

https://www.youtube.com/watch?v=yU7jJ3NbPdA

Marked as helpful

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