Social links profile main

Community feedback

• 

  Kamran Kiani•1,840

  @kaamiikPosted 1 day ago

  • I think you misunderstood the design. Your whole page has a black background.

  ---

  • Your img needs an alt="" of empty. The name is a heading. The address and job info should wrap inside a p. The socials are not button inputs. There are list items that is a ul and li and in each li you have anchor tag.

  ---

  • Try to use a proper CSS reset at the start of your CSS style. Andy Bell and Josh Comeau both have a good one. You can simply search on the internet to find them.

  ---

  • Use min-height: 100vh; instead of height:100vh;. height: 100vh strictly limits the height to the viewport size, potentially causing overflow issues if the content is larger than the viewport. On the other hand, min-height: 100vh allows your element to grow in height if the content exceeds the viewport size.

  ---

  • You should not limit your width: 1440px; and height: 960px; and there is no need for it. You did the same mistake for card. Never limit your width and height in a container or element or tag that contains text inside. When you limit the width and height of elements containing text, you risk the text being cut off, overflowing, or becoming unreadable, especially on smaller screens or when the text dynamically changes. It's generally better to allow the container to adjust its size based on its content or set a flexible size that can adapt to different screen sizes and text lengths. You only need max-width here because it prevents elements from stretching beyond a certain point, keeping them visually appealing across different screen sizes. It ensures your design remains adaptive and doesn't get too wide on larger screens.

  ---

  • Your font-size and max-width should be in rem unit not px. You can read this article about it and why you should not use px as a font-size.

  ---

  • Try to code mobile first.

  0