CSS and HTML List I have the Code and don't know what to do with it?

Question from someone "sort of NEW" to building a Web Site.

[HappyMomAnna]

I have template I have modified to create my site. It includes a CSS and I have only made some small modifications to it so far.

There is a navigation bar on the top and I am trying to put some Drop Down Menus in the navagation links.

I have found a site that helps generate code to make a drop down list and I have worked the Fisrt Navagation link drop down list out and generated both a CSS Code and HTML code.

I am not exactly sure what to do with it? I am guessing that I need to place the CSS Code in the CSS file first? But I am not sure where I would put it in order to be sure it shows up under the correct navagation link?

I also have HTML Code which I assume I would put on the Pages in the area where I have the navagation links?

The Code I created is to go under the HOME Link and I may need to adjust it and Add the ACTUAL Home link?

Maybe I am making this too hard on myself and there is a simpler way? I wanted to TRY to put the Drop Down Menues into the CSS so that I might not have to make the changes on EACH page of my site I am not sure if that is possible?

This is the CSS Code I have:
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
#navcontainer { width: 200px; }

#navcontainer ul
{
margin-left: 0;
padding-left: 0;
list-style-type: none;
font-family: Arial, Helvetica, sans-serif;
}

#navcontainer a
{
display: block;
padding: 3px;
width: 160px;
background-color: #036;
border-bottom: 1px solid #eee;
}

#navcontainer a:link, .navlist a:visited
{
color: #EEE;
text-decoration: none;
}

#navcontainer a:hover
{
background-color: #369;
color: #fff;
}
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
Below is the HTML Code I Have:
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
<div id="navcontainer">
<ul id="navlist">
<li><a href="#" title="Contact Us">Contact Us</a></li>
<li><a href="#" title="Guest Book">Guest Book</a></li>
<li><a href="#" title="News Letters">News Letters</a></li>
<li><a href="#" title="TOS-Disclaimers">TOS-Disclaimers</a></li>
</ul>
</div>

Now I just need to know what to do where and if this is what I want to do?

Thank YOU so much Anyone willing to help me figure this out. I have found that having the navagation links in my side bar is messy and I am trying to improve the navagation of my web site. Thanks for ANY HELP!

[edited by: SuzyUK at 8:34 am (utc) on Nov. 10, 2005]
[edit reason] examplified URLs [/edit]

[HappyMomAnna]

Now I have looked at about 10 different drop down menu generators and I am still not able to find a way to do what I hope to do.

It seems this should be easy and I am missing something?

Maybe I cannot use the CSS to put the meunes accross all the pages but I have found style codes for drop down menues I can place in the Head section and apply to the page.

I wonder if there is just some simple way that I can make the code for the style and another code for the menes themselves then upload each page?

I think I am making what I want to do too hard.

I would be happy to make the code one time and save as a notepad doc and then put the code on each page.

I like the style of the links that I have below my Header and I want to make each link a drop down menu with additional liks related. This seems like it should be simple. I have spent 3 days playing around and I cannot find anything that I like.

If anyone can just point me in the direction of where I might find a way to do this. I like my current CSS styles but, I want to make my navigation links turn into a drop down menu and it really cannot be as hard as I seem to be experiencing?

Thanks to anyone who might be able to give me a CLUE...

Anna