Article Preview Component

Hi

Well done on completing this challenge. It looks similar to the original design. However I would like to suggest something regarding the image styles applied -

Update the style of the drawers image and add width: 100% so that the image covers the whole area in the mobile design

The style you have provided to the profile image is also applied to the share button image. .profile img { height: 50px; width: 50px; border-radius: 50%; }

I suggest you should give the profile image a class or an id and directly access it so that the style is applied to that image only.

Also on the share button, you should update the .share-icon class styles to these - border-radius: 50%; padding: 18px; border: none; cursor: pointer;

And also update the .share-icon img style and set it to - height: 25px only.

I hope all these style updations help you achieve the share button look similar to the design.

Well Done. Keep it up!

Your project is very good! Congratulations! Keep it up!

I suggest that in the part with the link, you put the images inside the <a> and give them a CSS cursor pointer. The change could be like this, for example:

html

<div class="links"> <li><a href="#"><img src="./images/icon-facebook.svg" alt=""></a></li> <li><a href="#"><img src="./images/icon-pinterest.svg" alt=""></a></li> <li><a href="#"><img src="./images/icon-twitter.svg" alt=""></a></li> </div>

It is also advisable to fill in the alt attribute of the img to support screen reader users.

Best regards, Ana