Design comparison
SolutionDesign
Solution retrospective
I had trouble with the main background image. The challenge had 2 bubbles, one top left and the other bottom right. I could not figure out how to do that.
Feedback welcomed
Thanks so much!
Community feedback
- @correlucasPosted about 2 years ago
👾Hello @echoturnbull, Congratulations on completing this challenge!
Great code and great solution! I’ve few suggestions for you that you can consider adding to your code:
Here's your code fixed, you've a problem because the background-repeat, here's the correct code:
body { background-color: hsl(185deg, 75%, 39%); background-image: url(./images/bg-pattern-top.svg), url(./images/bg-pattern-bottom.svg); background-position: top -500px left -400px, bottom -700px right -250px; background-color: var(--Dark-cyan); background-repeat: no-repeat; background-size: 100%; margin: 3em auto; min-height: 100vh; display: flex; flex-direction: column; justify-content: center; align-items: center; }
✌️ I hope this helps you and happy coding!
Marked as helpful0
Please log in to post a comment
Log in with GitHubJoin 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