@Islandstone89
Posted
HTML:
-
"HTML & CSS" should be a
<h2>
. -
I would replace the
id
withclass
. -
The profile image needs a more descriptive alt text, for example "Headshot of Gary Hooper".
CSS:
-
Including a CSS Reset at the top is good practice.
-
I like to add
1rem
ofpadding
on thebody
, to ensure the card doesn't touch the edges on small screens. -
On the
body
, changeheight
tomin-height
- this way, the content will not get cut off if it grows beneath the viewport. -
Remove the
width
andheight
on the card. You should rarely set fixed sizes inpx
, as this prevents components from adapting to different screens. -
Add a
max-width
of around20rem
on the card, to prevent it from getting too wide on larger screens. -
I would use
rem
instead ofem
forfont-size
. -
line-height
should not be inpx
. Instead, use a number relative to the element's font size. For example, if the element has a font size of 16px, and you wanted a line height of 24px, then you would do24 / 16
, which is1.5
.