Blog preview card component

Looks good.

• The spacing between the elements are same in this design. So you can use the gap property without any issues. If somehow the spacing was different, and the difference was like 1px or 2px i would ignore it and still use the gap property. Sometimes designs can have inconsistencies. However, in this design the spacing is same. I checked the Figma file.
• I see you are using values like 16.8px, 15.4px. You most probably never will use broken values like these in actual production. 16.8px is 16px. I assume you don't have access to the Figma file and you may have guessed the values. It's totally fine. Just round the value to the nearest value you feel like.
• The "HTML & CSS" is a heading in this design. It's an <a> inside a heading.
• The text should be in a meaningful element like a paragraph tag <p>. Text alone inside a <span> or <div> is not recommended since neither of them are meaningful elements. You can replace all those span tags with p tags.
• In this design the whole card should be clickable. Not only the "HTML & CSS" part. Try to make it to work. You will need to use a pseudo element on the <a> for that.