CSS Sprite navagation menu won't appear in any browser? - html

Question

I am quite new to the world of HTML and CSS coding and am currently testing things out that I learn on my own website.
I have created a pretty simple nav menu I guess using CSS sprite coding, I am using Visual Studios 2012 and everything appears properly in that program, however when I try to test my webpage in any browser (IE, Google, Firefox) my nav menu just disappears. I notice that the cursor does change when I hover over the space where the nav menu should be, however as I said, no menu actually displays.
To add to that, other elements that I have in my page do appear and seem to function properly?
Here is the HTML code I am using
<div class ="navmenu">
<ul class ="navbar">
<li class ="Aboutus"></li>
<li class="Projects"></li>
<li class="Contactus"></li>
</ul>
</div>
and then the CSS
.navmenu
{
height: 120px;
position: relative;
}
.navbar
{
position: relative;
top: 0px;
left: 0px;
height: 79px;
}
.navbar li
{
list-style: none;
position: absolute;
margin: 0;
padding: 0;
top: 0;
}
.narbar li, .navbar a
{
height: 60px;
display: block;
}
.Aboutus
{
left: 0px;
width: 174px;
background: url('c:\users\teila\documents\visual studio 2012\Projects\Concept2\Concept2\Img\navMenu2.PNG') 0px 0px;
}
.Projects
{
left: 174px;
width: 174px;
background: url('c:\users\teila\documents\visual studio 2012\Projects\Concept2\Concept2\Img\navMenu2.PNG') -174px 0px;
}
.Contactus
{
left: 348px;
width: 174px;
background: url('C:\Users\Teila\documents\visual studio 2012\Projects\Concept2\Concept2\Img\navMenu2.PNG') -348px 0px;
}
.Aboutus a:hover
{
background: url('C:\Users\Teila\documents\visual studio 2012\Projects\Concept2\Concept2\Img\navMenu2.PNG') 0px -60px;
}
.Projects a:hover
{
background: url('C:\Users\Teila\documents\visual studio 2012\Projects\Concept2\Concept2\Img\navMenu2.PNG') -174px -60px;
}
.Contactus a:hover
{
background: url('C:\Users\Teila\documents\visual studio 2012\Projects\Concept2\Concept2\Img\navMenu2.PNG') -348px -60px;
}
I've tried looking for days as to what the problem could be, hopefully somebody could help me out. It would be greatly appreciated.

Answer 1

It may be because you have an absolute path to the image with c:/ etc. If you use the relative path sp perhaps img/ or /img/ or ../img/ using ../ to step back however folders back you need to go to reach your image folder from the css file.