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

Responsive card layout using media query.

@ar-mohanty

Desktop design screenshot for the NFT preview card component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Community feedback

Account Deleted

Hi

Congratulations on completing the challenge.

It is also recommended that CSS be saved in an external file and not internal or inline as that makes it more difficult to maintain and also makes it easier to switch between the markup and the CSS. As it is I am having to scroll up and down between your markup and styles.

Landmarks are important for adding structure to your page and landmarks such as <header>, <main>, <nav> and <footer> aid navigation in assistive technologies such as screen readers and for keyboard accessibility. Change your .main-container <div> to <main>

Pages must have a level one heading <h1> and you must not skip heading levels as in you cannot go from <h2> to <h4>.

You need to to fix the media query for large screen sizes as the page is broken. Put the correct unit on your transition duration.

hope this helps.

Happy coding.

0
Arlagonix 410

@arlagonix

Posted

Woah, it looks awesome! No problems whatsoever

0

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