Assessment wanted for Fundamental CSS comprehension
Link to task: https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Fundamental_CSS_comprehension#in_this_module
Link to my code: https://jsfiddle.net/EiNzp/c10gtxjy/1/
Thanks
Assessment wanted for Fundamental CSS comprehension
Link to task: https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Fundamental_CSS_comprehension#in_this_module
Link to my code: https://jsfiddle.net/EiNzp/c10gtxjy/1/
Thanks
Hi @EiN
Nice work on this exercise!
The height
of the header and footer text donβt have an effect on the layout. You could use line-height
. This would make sure that the text is vertically centered. You just have to make sure that font-size
and line-height
multiplied are equal the height of the header/footer:
.card header h2 {
font-size: 2em;
line-height: 1.5;
/* 2em x 1.5 = 3em (height of header) */
}
.card footer p {
font-size: 1.5em;
line-height: 2;
/* 1.5em x 2 = 3em (height of footer) */
}
Cheers,
Michael
Thank you for your comment and for checking my work. Thanks to him, I noticed and eliminated my mistake, and even more understood the topic of text centering.
Your comments and remarks help me a lot in learning, thank you.