Shahin NJ• 1,190
@SJ-Nosrat
Posted
Hi David, Great to see that you pushed through this challenge! Your solution looks good, I'd add the following below code, in order to center your card properly.
body {
padding: 130px 21px 20px 21px;
background-color: hsl(185, 75%, 39%);
background-image: url(images/bg-pattern-top.svg), url(images/bg-pattern-bottom.svg);
background-repeat: no-repeat;
background-position: right 51vw bottom 37vh,left 50vw top 45vh;
text-align: center;
font-family: 'Kumbh Sans' , sans-serif;
color: hsl(0, 0%, 59%);
/* ADD THE BELOW CODE*/
min-height: 100vh;
display: grid;
place-content: center;
}
Since you already added: height: 100%; to your <html> tag in your CSS the above min-height: 100vh; will let your page take up the entire viewport height; you can read the Freecodecamp article by Dave Gray here.
Hope the above helps!
Best of luck with your coding journey!
Marked as helpful
0
