Latest solutions
Latest comments
- @HatchinoSubmitted over 2 years ago@exploresahilPosted over 2 years ago
Hello Lea, I saw your code for this challenge. I think you need to define Height to the body element. And position: absolute to .attribution class (if you want it to be included in browser, other wise remove the - div class attribution - from html and css).
You can try these changes,
body { height: 100vh; /*----------------------> Add height 100% of Viewport---*/ font-size: 16px; display: grid; place-items: center; font-family: 'Red Hat Display', sans-serif; color: var(--Dark-blue); background: url(images/pattern-background-desktop.svg) no-repeat; background-color: var(--Pale-blue); background-size: contain; } .attribution { margin-top: 2rem; /*----------> can remove, not needed ---*/ color: var(--Desaturated-blue); position: absolute; /*-----------------------> Add Position - Absolute ---*/ bottom: 0; /*-----------------------> Will make sure attribution stay at the bottom ---*/ height: 40px; }
I think these changes will center the card to the browser-viewport. Thank you and have a good day.
1