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

Clipboard landing page

leverhβ€’ 300

@leverh

Desktop design screenshot for the Clipboard landing page coding challenge

This is a solution for...

  • HTML
  • CSS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


I actually enjoyed doing this challenge. My media query isn't the greatest - i know - too much work and too many little fixes but i hope to improve on my media query knowledge in the future. Would you recommend using the mobile first approach or the desktop first approach? Thanks :)

Community feedback

Tesla_Ambassadorβ€’ 2,980

@tesla-ambassador

Posted

Hey Leverh. Congrats on completing this great challenge! Your solution is looking pretty sharp!

  • It doesn't really matter whether you use mobile first or desktop (I use both πŸ˜‚) but most of the time I'd recommend desktop cause It's much easier to add appropriate styles (You are able to see what fits and what doesn't fit easily). On some occasions, you might want to use mobile first (Usually when I don't have that many components on my desktop) It's faster! You might want to also add some media queries on screens between 375px and 1170px to improve your website's responsiveness. follow this link to learn more about media queries.
  • You might also want to wrap your div with the attribution class in a landmark, in your case you could use the <footer> tag. To resolve some of your accessibility issues.
  • You might wanna use heading tags (<h2> - <h6> ) in your <sections>. In your case, you have two options, you can use <div> instead of the <section> because the div doesn't require you to add heading tags or you can make the headings to your sections <h2> tags. This will clear all your HTML validation issues Happy coding and keep up the good work!

Marked as helpful

1

leverhβ€’ 300

@leverh

Posted

@tesla-ambassador Thanks! that's some great feedback. I got a bit lazy in the end with the media query but i'll go back to it and do some more later. Thank you again x

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