Card component with HTML and CSS

Hey strael12,

I would suggest a few changes to make you solution better:-

1. Right now you have width: 37% on the .container-form. I would suggest setting the width in px instead of % beacuse right now the card's width is very less for screen sizes 1024px to 1440px. You can use max-width: 700px. This way the card's width does shrink appropriately for smaller screens but doesn't expand for bigger screens.

2. You can add a border-radius: 9px 0 0 9px on the card image to get rounded edges just like in the design.

Nice one I think you need to improve on the dimensions for your div tags. The width should be around 60-70% of the height. The image is stretched. You can use the "object-fit: contain" to make an image contained to the size of any given div. Grid is a fine tool to use but as for a beginner i would prefer using DISPLAY:FLEX as it is easier to control for this type of content.

Try to solve these problems one at a time. Nice work.