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

news homepage

Mahdi Karimianβ€’ 610

@Mahdii-Kariimiian

Desktop design screenshot for the News homepage coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
2junior
View challenge

Design comparison


SolutionDesign

Solution retrospective


my first hamburger menu. hovers does not work. I appreciate if some one help me with that.

Community feedback

@MelvinAguilar

Posted

Hello there πŸ‘‹. Good job on completing the challenge !

  • It seems that the hover effects are not working because the .hamburger-section div has a height of 100vh, which covers the entire viewport height. This causes the cursor to always be within the boundaries of the div, preventing it from detecting any hover events on other elements.

β€Ž β€Ž β€Ž β€Ž β€Ž You can use a media query to reset the width of the element to its content. This way, it won't affect hover events on other elements.

.hamburger-section {
β€Ž  β€Ž position: absolute;
β€Ž  β€Ž height: 100vh; /* This is causing your hover issue */
β€Ž  β€Ž . . .
}

Happy coding!

Marked as helpful

1

Mahdi Karimianβ€’ 610

@Mahdii-Kariimiian

Posted

@MelvinAguilar Thanks. That was the problem and Ifixed that.

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