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 Sunnyside Landing Page using CSS Grid, Flexbox, BEM, JS

@ereljapco

Desktop design screenshot for the Agency landing page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


I hope to hear feedback for the responsiveness of my code. I know there's a lot to improve on. And also, please guide me how I can make the hamburger icon and desktop menu better. Thank you! :)

Community feedback

@Sam-Guliker

Posted

Hi Erelita,

A good sollution! There isn't a lot of feedback I can give you. The only thing I could say: Did you check the responsiveness for a wide-screen? Your paddings break a bit.

Happy coding

Ps: I love what you did with the mobile animation

0

@ereljapco

Posted

@Sam-Guliker Hello! :)

May I know from what width? I'm still learning about responsiveness and this will be a great help for me. Thank you for pointing it out ^^

And I'm happy you loved the animation. I just tried it out :)

0

@Sam-Guliker

Posted

@erelita

Heyo,

I'm new to this platform but the code is: @media screen and (min-width: 55em) { But if you go wider, the paddings can break (try to drag out your browser if your screen isn't this wide.)

Oh and I also noticed you styled a lot with the classes, but you also style footer, li etc. Try to make them with classes aswel like: <footer class="footer"></footer>

I hope this made sense

Marked as helpful

1

@ereljapco

Posted

@Sam-Guliker I'll check the paddings tomorrow. Thank you so much! And yes, I use classes because I'm practicing BEM (not really sure if I'm applying it well on my code ^^'). Thank you for pointing it out. Really appreciate the detailed feedback :)

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