@Khawarmehfooz
Posted
Hey there, congratulations on completing this challenge, and you absolutely nailed it! I just wanted to answer your query about centering the card. The flex property approach you mentioned is indeed a good solution. However, I'd like to share an alternative approach with you.
To center the element perfectly, you can try setting the height of the <body> element to 100vh (which ensures it takes up the full viewport height) and use the display: grid property with place-items: center. This approach will also center the card flawlessly.
Here's an example of how you can achieve this:
body {
height: 100vh;
display: grid;
place-items: center;
}
Feel free to give it a try and see if it works for your specific case. Good luck, and keep up the great work!
Marked as helpful
@nithincspnr
Posted
Thanks for the detailed response @Khawarmehfooz. Your approach will definitely help me.
I am very new to this platform and really liked the support from this community. Hope I will have more learning opportunities here.
Thanks
@Khawarmehfooz
Posted
@nithincspnr You're welcome.
