Submitted 3 months ago

Article Preview Component - Vanilla HTML CSS JS

ijohnst• 230

@ijohnst

Preview site(opens in new window)View code(opens in new window)

This is a solution for...

Article preview component

HTML
CSS
JS

1newbie

View challenge

Design comparison

SolutionDesign

Solution retrospective

What are you most proud of, and what would you do differently next time?

I'm proud I got through this. I struggled way more with the CSS than I thought I would. Next time I would find an easier way to get this done

What challenges did you encounter, and how did you overcome them?

Positioning the share menu on desktop. It did not want to play nice until i eventually got there with some absolute positioning. I had no real issues with the JS, but the CSS really got me.

What specific areas of your project would you like help with?

An easier and cleaner way to handle the share menu on both desktop and mobile

Community feedback

Abdullah Bin Soulat• 110

@AbdullahSoulat

Posted 3 months ago

Great solution bud. There is only thing that issue that I found. When the card is in horizontal mode, the share section is not visible for some screen sizes. It goes off screen, since you are using position absolute. Maybe change the media queries to fix this issue. Otherwise good work!

Marked as helpful

ijohnst• 230

@ijohnst

Posted 3 months ago

@AbdullahSoulat I appreciate the feedback. That is on my todo list, I got frustrated with playing around with that stupid menu so long that I didn't go back and clean it up. Thanks for noticing, I'll take care of it!

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