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 Clipboard Landing Page (Grid, Flexbox)

@Slaks97 180

@Slaks97

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


How could I make my code cleaner and more concise?

I got lost so many times when I was styling the page, because I struggled to keep track of certain elements. I had to use borders to identify the element I was looking for!

I don't find it easy to name classes effectively.

Anyone willing to guide me? I would be so grateful!

Thank you!

Community feedback

@freaky4wrld

Posted

Hey there, you have come across very well with this project, kudos to your learning, as far as your concerns............ what I would suggest is to use classes that make more sense to you so that you have a bit of ease to style them!!!!

Here are some things that I would suggest :-

  • Instead of naming your section as section-1/2/3/4..........., you can use classes like section-intro-info, section-photo-show, section-icon-show, section-testimonial/affiliation, section-compatibility

  • instead of btn-1/2, you can use common btn class for padding/border-radius and shaping the button, for changing the background-color you can use class like btn-left/green or btn-right/violet.....

  • lastly try to use as much as common-relations and classes to inherit from, so that you don't get lost in the way.......

  • rest your code looks nice to me, and it will be cleaner/lot better with time!!

Hope it helps.........

Marked as helpful

1

@Slaks97 180

@Slaks97

Posted

Thank you so much for your help and words of encouragement @freaky4wrld!

I will apply your suggestions from now on :)

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