Hamburger crisis

Joined
Feb 15, 2021
Messages
99
Reaction score
0
hello,

having some wonky nav.... specificaly the hamburger dropdown

please see

Code:
https://codepen.io/Pavel_NA/pen/PoXoRKx

here my hamburger is fine :)

see

Code:
https://forallthetime.com/nature5/index.html

the exact same code, no hamburger drop down :(

in chrome dev tools and small browser

no luck on my iphone either

fire fox too

please help me!


thanks!!
 
Joined
Feb 15, 2021
Messages
99
Reaction score
0
crisis adverted :)

i figured it out

i have question, though

i think its straight foward...


on small devices, if you touch "Home" the hambuger disappeares! it go's completey white

help me with the code so instaed of white, its that comon green, please

and please explain what you did so i can learn from this

thank you!
 
Joined
Jul 4, 2023
Messages
366
Reaction score
41
It happens because you have css entry like this for menu

CSS:
/*Background color change during hover state*/
.navBar a:hover{
  background-color: white; 
  color: #547240; 
}

and hambuger has class icon

HTML:
<a href="javascript:void(0);" class="icon" onclick="openDrawerMenu()">☰</a>

just add different css only for hamburger button (<a> ☰)

CSS:
.navBar a.icon:hover{
  background-color: #547240;
  color: white;
}


CSS:
/*Background color change during hover state*/
.navBar a:hover{
  background-color: white; 
  color: #547240; 
}
.navBar a.icon:hover{
  background-color: #547240;
  color: white;
}

or

CSS:
/*Background color change during hover state*/
.navBar a:not(.icon):hover{/* all <a> without <a class=icon > */
  background-color: white; 
  color: #547240; 
}
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Similar Threads

Hamburger crisis 7
Hidden drop down 1
Image size confusion 2
Small screen layout trouble 3
Same code displayed differently 1
Placing a google map into my code 5
Validation crisis 12
Overlaping confusion 2

Members online

No members online now.

Forum statistics

Threads
473,770
Messages
2,569,583
Members
45,073
Latest member
DarinCeden

Latest Threads

Top