Responsive Profile card using HTML CSS

Community feedback

• 

  Luiza Uszacki•250

  @LuizaUszackiPosted over 2 years ago

  Hi @korede1004, good work completing the challenge!

  I also have some tips for you:

  1. Instead of using img tags to put the images as the background you could use the background-image: url('./images/bg-pattern-bottom.svg'). You can even add more than one image and the background color to the same element.

  2. Think about adding the main tag to your HTML for accessibility purposes and wrapping the main content in it.

  3. I saw that you have a padding-top to center the image, but depending on the screen size, it won't stay in the center. So, you could use flexbox. Once defined the container of the element, add display: flex; align-items: center; justify-content: center; on this container and it will center all its direct children in the center on both axes.

  Just an extra tip: you could use your body as the background/container of the card and build your card in the main tag.

  Hope it helps!

  Marked as helpful

  0

  ---

  

  Aderibigbe Adekorede Azeez•80

  @korede1004Posted over 2 years ago

  @LuizaUszacki thank you for your feedback it is really helpful

  0