- I am using this template as a base for my portfolio, https://html5up.net/phantom
Currently, there is a hamburger navigation in both web and mobile. How can I make it so that hamburger menu only shows on mobile? I tried changing the @media screen and (max-width: 736px) { to 480 for the menu CSS but it doesn't change anything..?
- Also is there a way to change the pink hover of the menu?
CodePudding user response:
Simple solution, but kinda works.
- Set burger menu to display: block;
- then have @media only screen and (min-width: width that you want) and inside you set burger menu to display: none; That means that from the width you set in the media queries it won't display the menu.
Hover you can simply change easy. Just find in the code where the :hover has the property color:; set to pink - and in your code override it with targeting the element and adding :hover and then adding the color you want it to be.
CodePudding user response:
/*use*/
@media only screen and (max-width: 736px){
/*then put the hamburger class here*/
}
<iframe name="sif1" sandbox="allow-forms allow-modals allow-scripts" frameborder="0"></iframe>