Design comparison
Solution retrospective
how can I improve my code pls? responsive design is my biggest issue how can improve it? thank you!
Community feedback
- @correlucasPosted about 2 years ago
👾Hello @anasssanba1, Congratulations on completing this challenge!
You have not applied the svg wave background yet, here's how u can do it quickly":
First of all add the image as a background inside the
body
this is the code for that:background-image: url(../images/pattern-background-desktop.svg);
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%
,The SVG background is not properly applied, to fix that first you need to add
background-size: no-repeat
(to avoid it repeating) and then addbackground-size: contain
to make it fit full width and vertically aligned with the card.✌️ I hope this helps you and happy coding!
Marked as helpful0 - @JorggyhPosted about 2 years ago
For me the easiest way is with media queries, do you know how it works?
0
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