Hi, I tried to use relative and fixed to the position line in my nav element in my main.css. I also tried adding an outline line to the nav, nav li, and nav a elements. I still can't get it to space out. It changed it a little bit, but it's pretty messed up. Check out what it's doing.
www.marksbodyshop.org
Thank you
Shane
Here is my main.css code:
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%;}