Responsive Article Preview Component

Community feedback

• 

  Baktygul•90

  @MBaktygul

  Posted 6 months ago

  Hello there 👋 I have some suggestions about your code that might interest you:

  I suggest you add object-fit: cover;. It ensures that the image maintains its aspect ratio and fills the container without being squished.

  And object-position: left;. It aligns the focal point of the image to match the design better.

  Here’s your improved CSS:

  .left img {
      border-top-left-radius: 10px;
      border-bottom-left-radius: 10px;
      width: 100%;
      height: 100%;
      object-fit: cover; /* Prevents image distortion */
      object-position: left; /* Aligns the image properly */
  }
  

  Keep up the great work 🎉

  Happy coding! 🚀

  00