Social Links Profile

Community feedback

• 

  Ranit Manik•880

  @RanitManikPosted 5 months ago

  Hey there! I noticed a few issues while reviewing your site:

  1. Image Aspect Ratio: You've set explicit width and height for images, which is great for consistency. However, this causes the images to stretch unnaturally. Consider using object-fit: cover; for images to maintain their aspect ratio while filling the container appropriately.

     img {
       object-fit: cover;
     }
     

  2. Centering the Container: Instead of using margin-top on .container to center it vertically, a more effective method is to use min-height: 100vh; on body and display: grid; place-items: center; to center .container. This approach ensures better responsiveness and alignment.

     body {
       min-height: 100vh;
       display: grid;
       place-items: center;
     }
     

  3. Active State for Links: When hovering over links, the background color changes, but the text color remains unchanged. Ensure that the text color also adjusts in the active state to maintain consistency and improve usability.

     a:hover {
       background-color: /* your hover color */;
       color: /* adjust text color for readability */;
     }
     

  I hope you find these suggestions helpful for improving your site's design and functionality. Feel free to reach out if you have any questions or need further assistance!

  Marked as helpful

  0