Submitted over 1 year ago

Article preview component

Amir Hashemi•480

@AmirhosseinHashemi

Preview site View code

This is a solution for...Article preview component

HTML
CSS
JS

1newbie

Design comparison

SolutionDesign

Solution retrospective

Hello every one

I complete main style of this project about two hour but complete active state take me many hour I do my best to complete it.

At the end there is one problem :

to create tooltip I used clip-path but unfortunately this property cause element don't show box-shadow and border-radius.

I made with :

HTML
CSS
Flexbox

Here is my solution :

solution

Any useful comment make me happy :)

Community feedback

_nehal💎•6,710
@NehalSahu8055Posted over 1 year ago
Hello Coder 👋.

Congratulations on successfully completing the challenge! 🎉

Look like your image is not properly aligned with the given design

Fixing drawer image position

Add these lines to your image and see the effect.

.drawer { object-fit: cover; object-position: left; }

For reference see my project link

I hope you find this helpful.

Happy coding😄
Marked as helpful
2
Amir Hashemi•480
@AmirhosseinHashemiPosted over 1 year ago
@NehalSahu8055 Hello my friend

Thanks so much for your useful help. I tried for fix it but I can't and then I forgot it but now your hint was so sweet and I never had use this property before . I will use your tip :)

happy coding my friend
0

Please log in to post a comment

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord