Design comparison
Solution retrospective
check my animated hamburger
Community feedback
- @Mahesh-yadavPosted over 4 years ago
Hi Great solution. Your cross icon is not perfectly centered. I also faced this problem. My solution is that while applying transform change the order - first translate both lines so that they lie above each other and then you can rotate.
2 - @ovidiuantonioPosted over 4 years ago
Hello, very nice solution! It's very responsive, looks very nice and the hamburger is nice done! You did a great job! One thing for the burger that you can add is
cursor: pointer;
to the entire hamburger div, not for the lines that form it because if you hover the cursor between the lines the pointer disappears.Happy coding! Keep going!
2@Da7yPosted over 4 years ago@ovidiuantonio why do i need cursor: pointer; in mobile size? will it make a different?
0@ovidiuantonioPosted over 4 years ago@Da7y
cursor: pointer;
on clickable elements helps you create a better user experience (ux)0@Da7yPosted over 4 years ago@ovidiuantonio ya but in mobile there is no cursor ,so i think it's an useless line of code and should have removed it. if u have other opinion plz tell me
0@mattstuddertPosted over 4 years ago@Da7y I’d still recommend adding it. People with poor eyesight will often zoom in their screen. This will trigger the mobile layout. So you could still have people who are using a mouse on the mobile layout on your site.
Hope this helps!
1
Please log in to post a comment
Log in with GitHubJoin 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