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
Request failed with status code 502
Not Found
Not Found

Submitted

nft preview card

MHAA 50

@MHA2001

Desktop design screenshot for the NFT preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


In this challenge, I noticed that the appearance of the website is slightly different in different browsers. In my solution there is a gap between the bottom of the page and the content in Chrome but not in Edge. How should we solve these kinds of problems?

Community feedback

Steve 1,170

@peanutbutterjlly

Posted

hey 👋,

each browser has default styles for different things that (unsurprisingly) look different across each browser.

to help with that, you can put a css reset in there and adjust the styles that you want; I really like to use Josh Comeau's reset (I've tweaked it a little bit for my own purposes) as it serves as a good base.

Josh Comeau: custom css reset

your solution looks great! and good eye on catching it on a different browser too

Marked as helpful

0

MHAA 50

@MHA2001

Posted

Hei,

Thank you for your feedback. It was really helpful. I had heard about CSS Reset, but I didn't know exactly what it was used for. I have to use it in the future.

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