Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

3 Column Preview Card (HTML, CSS, Flexbox, CSS Grid, Media Queries)

@SalahShadoud

Desktop design screenshot for the 3-column preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

@Aziztheprogrammer

Posted

Hi Salah, I First of All I Appreciate Your Effort ! And Congratulations for Finishing This Project (; I Really Liked Your Work And How You Are Using Variables In Your Work. I Want Just To Mention That I Think Adding A Transition To The Button Will Make It Smoother And Better And I Want To Ask You About font-smoothing: antialiased; And Why You Are Using It In Your Code ? And Thanks !

Marked as helpful

1

@SalahShadoud

Posted

Hi Aziz! Thnx for reviewing my code, your rught abiut transition and i usually use it on every hover effect or animation but looks like i forgot to add it on this one, so thnx again for reminding me.

I use font-smoothing: antialiased; so the light-colored text on dark backrounds looks lighter for better reading experince.

1

@Aziztheprogrammer

Posted

I Faced This Advise From Someone Who Told Me to Add a CSS Reset File and I’m Working With It Now, So Thank You for Advice Salah, but I Have One in My Work

1

@Aziztheprogrammer

Posted

Hi Salah Again ! Thx for the information i will use it in the future, that's a very good property, Thx Again !

1

@SalahShadoud

Posted

Anytime Man <3, and thank u again for reminding me. and if you are interested in a better looking pages i wanna introduce you to CSS Resets, i use it in every project or challenge i work on, the basic idea behind it is that HTML Elements have default spacings and margins and paddings so this article teach how to get rid of the default behaviors of HTML Element so u can add your own spacings and margins and paddings, hope this will help you in your future projects of challenges, Happy Coding.

1

Please log in to post a comment

Log in with GitHub
Discord logo

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