Submitted 3 months ago

Features cards section build with grid

Alex• 3,130

@Alex-Archer-I

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

This is a solution for...

Four card feature section

HTML
CSS

1newbie

View challenge

Design comparison

SolutionDesign

Solution retrospective

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

I decided to try OOCSS convention one more time. Guess I started to understand it better. But that approach totally not suit small projects like this.

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

Sometimes it's a challenge to figure out what to write here. I overcame it with my imagination.

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

I'm open for every suggestion =)

Community feedback

MikDra1• 6,090

@MikDra1

Posted about 1 month ago

Nice one 😀

If you are curious how you can do this straight lines on the top of each card here is my tip:

Create another element in each of the cards. Then position this element absolute. Card should be positioned relative. At the end you need to give this element a height of 3px width of 100% and top 0 and left 0. You can also use ::after or ::before pseudo elements to create these.

Hope you found this comment helpful 💗

Good job and keep going 😁😊😉

Marked as helpful

Alex• 3,130

@Alex-Archer-I

Posted about 1 month ago

@MikDra1

Hey, thanks!

Yeah, it's always a few ways to achieve some effects. Here I made it with border-top property =)

PolternCat• 30

@joshuapoc

Posted 3 months ago

My friend I looked at several of your challenges code its so cool the way you keep everything organized. I wish i could give feedback but youre the jack of all trades. Keep it up :)

Alex• 3,130

@Alex-Archer-I

Posted 3 months ago

@joshuapoc

Whoa, thank you a lot! This is already a cool feedback, it's encouraging =)

That's funny, I was always told that I lack organization. But, I have to say, it's a bundlers, like Vite or WebPack, which helps to keep code in separate files.

How is your progress? =)

Btw, I wrote you at the discord a few days ago.

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