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

Responisve Profile card component using Flexbox

ArslanJ9 150

@Arslanj9

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


Anything that can help me improve on this would be appreciates!

Community feedback

Fidel Lim 2,775

@fidellim

Posted

Hi Arslan,

Great work on this project! Works great for both desktop and mobile views! You might want to re-arrange the position of bg-circles on mobile view. Other than that looks great! Keep it up :)

Marked as helpful

0

ArslanJ9 150

@Arslanj9

Posted

Thank you so much @fidellim for helping me again!

I tried my best to re-arrange the position of bg-circles on mobile view but had failed. Could you please take some time and make that for me, it would be really helpful!

Regards!

0
Fidel Lim 2,775

@fidellim

Posted

@Arslanj9 You can try this one. It is better to add a media query so that you can change the structure of your site depending on the screen size.

/* @media (max-width: 550px) {
    body {
        background-position: right 60vw bottom 80vh, left 60vw top 80vh;
    }
} */

I hope it helps :)

Marked as helpful

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