HTML CSS Profile Card

Community feedback

• 

  Michael Bishop•1,080

  @MikeBish13Posted about 3 years ago

  Great job - your solution looks really good!

  You are definitely on the right tracks with using semantic HTML and it is a great habit to get in to. Just be careful about overdoing it and putting in semantic tags for the sake of it. For example, you have a <header> tag for the background section at the top of the card but, in my opinion, the tag should usually be reserved for encapsulating things such as logos, navigations, etc. Here's a line taken from MDN:

  "<header> element represents introductory content, typically a group of introductory or navigational aids. It may contain some heading elements but also a logo, a search form, an author name, and other elements."

  Similarly, it's great that you're using <h> tags for your headings. But you can resize them manually, so that they match up to the design - some of your sizings are a bit off. But obviously make sure you're resizing each of them proportionally so that you maintain the hierarchy.

  Hope that helps and keep up the good work!

  Marked as helpful

  1

  ---

  

  Jesse Ma•95

  @jma26Posted about 3 years ago

  @MikeBish13 Thank you! For this case, I probably did not need the header tag and leave the img as is.

  #happycoding

  0