@correlucas
Posted
πΎHello Idev, congratulations for your new solution!
Nice solution and nice results! You're in the right track.
I've some suggestions for you to improve your code:
1.Use background-size: container
to have the wave svg background centered and well positioned:
body {
background-image: url(./images/pattern-background-desktop.svg);
background-repeat: no-repeat;
background-size: contain;
background-color: hsl(225, 100%, 94%);
margin: 0;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
min-height: 100vh;
font-family: 'Red Hat Display', sans-serif;
}
2.You can use relative units
as rem
or em
that have a better fit if you want your site more accessible between different screen sizes and devices. REM
and EM
does not just apply to font size, but to all sizes as well.
βοΈ I hope this helps you and happy coding!
Marked as helpful