I have tried changing the position line in the nav element to fixed and relative, but still not having any luck. I also tried to add outline lines to my nav, nav li, and nav a elements. It hasn't given me any space. It's now kinda messed up. www.marksbodyshop.org
Thanks
Shane
Here is my main.css coding as of now:
html, body {
height:100%;
margin:0;
background-color:#000;
background-image:url(../images/firstpage.gif);
background-size:100% 100%;
background-repeat:no-repeat;
background-attachment:fixed;
border:0;
padding:0;
}
#container {
height:73%;
}
#nav {
position:fixed;
padding:10;
margin:10;
border:10;
outline:10;
list-style-type:none;
height:7%;
width:57%;
top:40%;
left:5%;
z-index:2;
}
#nav li {
width:16%;
margin:10%;
outline:10%;
border:10%;
padding:10%;
height:100%;
}
#nav a {
display:block;
width:100%;
height:100%;
margin:10%;
border:10%;
outline:10%;
padding:10%;
outline:none;
text-indent:-9999px;
background-size:100% 300%;
}
#about {background-image:url(../images/aboutus.png);}
#about1 {background-image:url(../images/contactus.png);}
#about2 {background-image:url(../images/freelunch.png);}
#about3 {background-image:url(../images/map.png);}
#about4 {background-image:url(../images/meettheteambutton.png);}
#nav a:hover {background-position:0 -100%;}
#nav a:active {background-position:0 -200%;}