Solution retrospective
The area i was unsure or let me say i don't understand is in my css where height: calc(100vh - 1px); though i was able to finish this challenge with the help of a tutorial video and i learnt new things which are :
- How to add an image together with the title
- Declaring a :root for the colors i will be making use later on
Please log in to post a comment
Log in with GitHubCommunity feedback
- @dannymccabe
Hey, "height: calc(100vh -1px);" calc means calculate. 100vh means the full height of the screen. So on desktop or mobile, the height will always be 100% of the screen. Calculating the height by subtracting 1px will return the size of the screen, minus one pixel. The benefit of this is that CSS will convert 100vh to a pixel value. Pixels are better supported across browsers and vh or vw units can create unexpected issues in some places. Hope that is helpful.
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