Profile Card Component using HTML and CSS

Community feedback

• 

  Mohammad Ashir•140

  @A-shir1Posted over 3 years ago

  For the background images, try putting them in css using the background-image: url (images/images/bg-pattern-top.svg), instead of putting them in HTML with img tags.

  Few more things that I noticed :-

  1- For the body height try using height: 100vh; instead of hard coding using px.

  2- For the width of a div or image, try to use % or rem or em instead of pixels. What it does it makes the size just a little more dynamic to the screen width (in case of %).

  3- You have a typo in font-family and that is why the font wasnt applied.

  4- Try learning and implementing flex and flexbox. It makes your life sooo much easier.

  Seeing as you might be new to webdev, just keep practicing and dont stress it. It only gets easier :)

  0

  ---

  

  Elmer Gallardo•10

  @egallardoPosted over 3 years ago

  @A-shir1 Thank you so much for your feedback! already implemented some of your suggestions and will look into flex and flexbox.

  by the way, I implemented the background-image in the CSS and that fixed my size issue, right now I am struggling to use both background images, should I create a div for each background? or is possible to use both of them in the body?

  0

  

  Mohammad Ashir•140

  @A-shir1Posted over 3 years ago

  @egallardo You can add multiple background images on the body. Read about that on this link.

  And anything and everything you get stuck with, just google it. You will always find the solution for your problem.

  0

  

  Elmer Gallardo•10

  @egallardoPosted over 3 years ago

  @A-shir1 Thanks for the link!

  already implemented the solution, ty for the help!

  0