@correlucas
Posted
👾Hello Oishik Biswas, congratulations for your new solution!
🎨 You’ve done really good work here putting everything together, I’ve some suggestions to improve the design:
You've missed tha wave background. Here's the steps to add it:
1.Add the image as a background inside the body this is the code for that: background-image: url(../images/pattern-background-desktop.svg);
2.add background-repeat: no-repeat to avoid the background repeating and background-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 use background-size: 125%,
The best to way to have this image and every image responsive and easy to work, its by creating a general property adding display: block and max-width: 100% to make it fits the size of the container the image is inside and also respect the container width while scaling, add alsoobject-fit: cover to make the image auto-crop when resizing inside the column:
img {
display: block;
object-fit: cover;
max-width: 100%;
}
✌️ I hope this helps you and happy coding!
Marked as helpful
