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 design with flex

@AbdessamadLahrizi

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


I found problem on background circles

Community feedback

@Karrar-Hussein

Posted

One easy way to fix it is to set the circles as two background images and position them using the background-position property it should be something like this:

body {
  background-color: var(--clr-Dark-cyan);
  background-image: url(images/bg-pattern-top.svg),
                    url(images/bg-pattern-bottom.svg);
  background-repeat: no-repeat, no-repeat;
  background-position: right 49vw bottom 45vh, left 49vw top 50vh;
}

Now you're good to go😁🔥

happy coding✨

Marked as helpful

0

@AbdessamadLahrizi

Posted

@Karrar-Hussein thank you so much it was really helpful information.

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