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

Fylo dark theme Customized

@doums85

Desktop design screenshot for the Fylo dark theme landing page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


Hi guys ! 👋

So I customized the design

  • I changed button 's background

  • I changed link's color

  • I add an animations into my css

Any feedback is welcome

Community feedback

P
ApplePieGiraffe 30,565

@ApplePieGiraffe

Posted

Hey, Seck Mamadou! 👋

You've done a great job on this challenge! The animations you added to the page are very cool! 😎

I suggest,

  • Adding a hover state to the navigation links in the header and footer of the page, the buttons, and the social media links in the footer of the page.
  • Adding some padding to the sides of the page in the mobile layout of the site to give some of the content of the page a little more room.
  • Setting overflow-x: hidden on the body (or something similar) so that there is no horizontal scroll bar in the desktop layout when the width of the page decreases.

Keep coding (and happy coding, too)! 😁

0

@doums85

Posted

@ApplePieGiraffe

Hi bro thanks for feedback and compliment ! 😁

I'll add a hover and padding but I don't know why but overflow-x: hidden doesn't work I try everything while 2 hours but nothing change.

Do you've a tip for me ?

0
P
ApplePieGiraffe 30,565

@ApplePieGiraffe

Posted

@doums85

I opened up Chrome's developer tools and noticed you added overflow-x: hidden inside a media query in the body. When I simply added overflow-x: hidden outside of the media query, it seemed to do the trick! 😉

0

@doums85

Posted

@ApplePieGiraffe I resized my container and overflow-x work now

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