Responsive page

Community feedback

• 

  hitmorecode•6,680

  @hitmorecodePosted 14 days ago

  Nice well done. I have a few suggestions for you

  • As you can see your final product does not look like the design. Try to make it as close as possible to the original design.
  • The font style and font size on the buttons is not the same as in the design.
  • Be more organized when building your html file. Use container to contain the content of the page, don't use it to create a card. Create a container and place the card inside the container.
  • When you want to add a border radius to the corners, don't use % (unless you want the radius to have a certain look) use these instead px, rem, em.
  • When creating cards when possible avoid using width: auto and height: auto use fixed width and height instead. Making it auto might add some strange behavior on the card.
  • Avoid using named colors and also stick to one method. Right now you are using named colors, hex-code and rgb. Make everything either rgb or hex.
  • When you know what font will be used the most on a page, just add that font-family on the body. This will prevent you from repeating yourself. If a different font is used elsewhere, just use that specific font on that specific element.
  • 1 second for a animation is quite long. For this kind of animation is best to make it as short as possible. You should change 1s to maybe 300ms.
  • Avoid using text-align: center to center elements on a page, use either flexbox or grid. Use text aling only when you want to align a text.

  These are a few tips that I have for you. If you want to you can use my page as an example.

  • social link profile.

  I hope this was helpful if you have any questions let me know. Keep it up 👍

  Marked as helpful

  0

  ---

  

  William Berhane•30

  @will3343Posted 14 days ago

  @hitmorecode Thank you for your tips, it was very helpful. I will work on it.

  0
• 

  Psalmorg•190

  @PsalmorgPosted 14 days ago

  I don't check the code but you need to margin-bottom to create space between the profile and the footer text at the bottom, margin at the left hand side of for your link button to centralize it and there should be margin top and bottom for it to create a little bit of spacing. The link button also need a border-radius and try to change profile background color to match the design.

  • The font-size of the button also need to be decrease.
  • Profile name and the address space it too much. You can try to reduce the default margin bottom or top This is good but you can do better

  Marked as helpful

  0