Design comparison
Solution retrospective
Please I have a lot of things wrong with this project and would love it if someone can help me with the following areas: 1.How do I set the height of the image to be the view height? It seems that every-time I try to do this it just sets the profile card off balance. 2. How do I position the background image like how it was positioned in the demo? 3.How do I properly overlay the profile image on the bg-pattern? I am not happy with the way I did it, and plus it makes the profile image not to be responsive. Thank You very much
Community feedback
- @nikavolkPosted over 2 years ago
Hello!
#1 If you would like to set a height of any element to the full view height, you can do it by assigning height: 100vh. For a quick fix to your card positioning, what I did was replace the 3em max-height with height:100vh, and added to body {} display: flex; That should center the card.
#3 I used position: absolute and the transform attribute to position the element in a similar project.
No idea on the second point, maybe someone else could help with that 😊
0@ugochukwuuuPosted over 2 years ago@nikavolk Thank you very very much. I really appreciate 😄
0
Please log in to post a comment
Log in with GitHub
Join 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