.nav-btn {
display: block;
background-color: #000;
color: #FFF;
font-size: 1.5em;
/*text-align: right;*/
/*right: 2%;*/
float: right;
cursor: pointer;
padding-top: 20px;
/*position: absolute;*/
}
.nav-btn:before {
background-image: url('http://optimumwebdesigns.com/icons/mobile_menu_white.png');
background-size: 28px 28px;
background-repeat: no-repeat;
padding-right: 15px;
width: 28px;
height: 28px;
content:"";
display: block;
padding-top: 0;
float: right;
}
When my menu appears at 640px
screen size, the image in the button moves under the menu when selected. I want it to remain fixed in place whether the menu is open or closed.
Also, why does the background-color
change to blue when the button is clicked?
What might be causing these issues?