path for css sheet

hello, i'm trying to make the following code work but now came to the point where i'm out of solutions. This is a horizontal menu bar with an active and hover feature. The css sheet is in a map called "support files" and need to know how to write and where i can put the path to the css file.... I found the script on the net and don't know much about css
Here is the CSS, below the HTML

#navcontainer ul li
{
list-style-type: none;
padding: 0;
margin: 0;
display: block;
float: left;
background: url("image-files/navBarBg.gif") repeat-x 20px;
font: 10px/20px "Lucida Grande", verdana, sans-serif;
text-align: center;
}

#navcontainer a
{
color: #000;
text-decoration: none;
display: block;
width: 100px;
border-top: 1px solid #A8B090;
border-bottom: 1px solid #A8B090;
border-left: 1px solid #A8B090;
}

#navcontainer li#active { background: url("image-files/navbarBgactv.gif") repeat-x 20px; }
#navcontainer a:hover { background: url("image-files/navBarBgHover.gif") repeat-x 20px; }

HTML:

<div id="navcontainer">
<ul id="navlist">
<li id="active"><a href="#" id="current">Road Map</a></li>
<li><a href="#">Market Movers</a></li>
<li><a href="#">FX Courses</a></li>
<li><a href="#">Research</a></li>
<li><a href="#">Gain Capital</a></li>
<li><a href="#">Bookstore</a></li>
<li><a href="#">Psychology</a></li>
</ul>
</div>


Thank you..... reding

 

I'm not quite sure what you're asking really tbh and lack the effort to read it through again , but try changing
image-files/navbarBgactv.gif
to something such as:
../image-files/navbarBgactv.gif

 

thanks for the pointer, what i wanted to know is, once the website with that menu bar is on the server then is it going to find the css sheet. I thought theres a path neccessary to tthe directory so it can find that specific sheet...

 

You can have styles in a separate file, like this:

<link rel="stylesheet" href="css/stil.css" type="text/css" title="default">

Code (markup):

This means: in this directory where your html is, is folder css and in folder css is file stil.css.

Or you can just include styles inline, in head section:

<style type="text/css">
<!--
form { display: inline; }
label { cursor: default; }
.tralala { font-weight: normal; }
.inlineimg { vertical-align: middle; }
-->
</style>

Code (markup):

 

thnx, doing my best understanding the lingo. everything works fine when i do a preview on dreamweaver but when the same page is uploaded to the webserver the hover and active feature dont work. Also, during the upload the program usually ask for the necessary gif files for a html or css sheet, this time it only asked for the background gif and not hover and active gifs eventhough the paths are right there in the css sheet.....

 

Can we see how it looks? You may put that link here.

 

sure, http://www.fantasticforex.com/fundamental-analysis.html

 

Maybe there will be more things to correct, but first you need to upload these files:

http://www.fantasticforex.com/image-files/navbarBgactv.gif
http://www.fantasticforex.com/image-files/navBarBgHover.gif
http://www.fantasticforex.com/image-files/navBarBg.gif

 

the funny thing is they're uploaded under the names navbarbg.gif , navbarbgactv.gif and navbarbghover.gif ... the same names are found in the paths in the css script


UPDATE:

Pierre, the problem looks to be solved, i removed all capital letters from the gif file names, not sure why but it seems to be an issue for the webserver. the names are now like the ones above, all lower case...

If you have further suggestions and tips please share, i need all the help i can get , especially with the index page ,seems to load a bit slow for my taste....

 

I just saw I got for my previous post. Very nice...

You can, but you should avoid using capital letters in file names.

If you know how, you can also use spaces in filenames, but you should avoid them.

Your page loads fast here.

btw: i am a wrong guy for suggestions and tips.