Design comparison
SolutionDesign
Community feedback
- @correlucasPosted about 2 years ago
👾Hello @teboola, Congratulations on completing this challenge!
Great code and great solution! I’ve few suggestions for you that you can consider adding to your code:
Then you add
background-repeat: no-repeat
to avoid the background repeating andbackground-size: contain
to make it fit full width and center with the card this is the best choice, but an alternative to resize it is to usebackground-size: 125%
, Here’s the code with the modification and the image applied as background:body { background-size: contain; background-image: url(../images/pattern-background-desktop.svg); background-repeat: no-repeat; line-height: 1.5; /* background-image: url(/images/pattern-background-desktop.svg); */ background-repeat: repeat-x; background-color: hsl(225, 100%, 94%); color: hsl(224, 23%, 55%); font-family: "Red Hat Display", sans-serif; }
✌️ I hope this helps you and happy coding!
1
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