Assessment wanted for Fundamental CSS comprehension (Task 1)

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 :wink:

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

1 Like

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.

1 Like