I am trying to get a charity website up and running. I understand that you want people to learn for themselves but at the moment I need to get the site up and running and money coming in!

I would like to install a simple dropdown menu on the site. I have downloaded the code from cssmenu.co.uk and have tried implementing it with disasterous results. My menu content disappeared and the menu flew out and across the header to the left.

I am using the 'centered' option here: cssmenus.co.uk/dropdown.html

I have uploaded the images .. no problem as am changing them.
I am fine with the .css

<b>the navigation element itself I am not fine with</b>

-----------------------------------------------------------------------------------------------------

<ul id="menu">
   <li><a href="index.html"><b>Home</b></a></li>
   <li><a href="single.html"><b>Single Level</b></a></li>
   <li class="current"><a class="sub" href="dropdown.html"><b>Dropdown</b><!--[if gte IE 7]><!--></a><!--<![endif]-->
   <!--[if lte IE 6]><table><tr><td><![endif]-->
      <ul class="sub1">
         <li><a class="fly" href="#url">Dropdown one<!--[if gte IE 7]><!--></a><!--<![endif]-->
         <!--[if lte IE 6]><table><tr><td><![endif]-->
            <ul class="fly1">
               <li><a href="#url">Dropdown 1.1</a></li>
               <li><a href="#url">Dropdown 1.2</a></li>
               <li><a href="#url">Dropdown 1.3</a></li>
               <li><a href="#url">Dropdown 1.4</a></li>
               <li><a href="#url">Dropdown 1.5</a></li>
               <li><a href="#url">Dropdown 1.6</a></li>
            </ul>
         <!--[if lte IE 6]></td></tr></table></a><![endif]-->
         </li>
         <li class="currentsub"><a class="fly" href="#url">Dropdown two<!--[if gte IE 7]><!--></a><!--<![endif]-->
         <!--[if lte IE 6]><table><tr><td><![endif]-->
            <ul class="fly2">
               <li><a href="#url">Dropdown 2.1</a></li>
               <li><a href="#url">Dropdown 2.2</a></li>
               <li class="currentfly"><a href="#url">Dropdown 2.3</a></li>
               <li><a href="#url">Dropdown 2.4</a></li>
               <li><a href="#url">Dropdown 2.5</a></li>
            </ul>
         <!--[if lte IE 6]></td></tr></table></a><![endif]-->
         </li>
         <li><a href="#url">Dropdown three</a></li>
         <li><a href="#url">Dropdown four</a></li>
         <li><a class="fly" href="#url">Dropdown five<!--[if gte IE 7]><!--></a><!--<![endif]-->
         <!--[if lte IE 6]><table><tr><td><![endif]-->
            <ul class="fly3">
               <li><a href="#url">Dropdown 5.1</a></li>
               <li><a href="#url">Dropdown 2.2</a></li>
               <li><a href="#url">Dropdown 3.3</a></li>
            </ul>
         <!--[if lte IE 6]></td></tr></table></a><![endif]-->
         </li>
      </ul>
   <!--[if lte IE 6]></td></tr></table></a><![endif]-->
   </li>
   <li><a class="sub" href="dropline.html"><b>Dropline</b><!--[if gte IE 7]><!--></a><!--<![endif]-->
   <!--[if lte IE 6]><table><tr><td><![endif]-->
      <ul class="sub2">
         <li><a href="#url">Dropline one</a></li>
         <li><a href="#url">Dropline two</a></li>
         <li><a href="#url">Dropline three</a></li>
         <li><a href="#url">Dropline four</a></li>
         <li><a href="#url">Dropline five</a></li>
         <li><a href="#url">Dropline six</a></li>
      </ul>
   <!--[if lte IE 6]></td></tr></table></a><![endif]-->
   </li>
   <li><a class="sub" href="flyout.html"><b>Flyout</b><!--[if gte IE 7]><!--></a><!--<![endif]-->
   <!--[if lte IE 6]><table><tr><td><![endif]-->
      <ul class="sub3">
         <li><a href="#url">Flyout one</a></li>
         <li><a href="#url">Flyout two</a></li>
         <li><a href="#url">Flyout three</a></li>
         <li><a href="#url">Flyout four</a></li>
      </ul>
   <!--[if lte IE 6]></td></tr></table></a><![endif]-->
   </li>
   <li id="support"><a href="support.html"><b>Support</b></a></li>
   <li id="contact"><a href="contact.html"><b>Contact</b></a></li>
</ul>

---------------------------------------------------------------------------------------------------------------------

I just really don't know where to start with this, please help.

made dropline like so:

if your sitetree structure for dropdown is like so:

Page 1
-subpage 1
-subpage 2
--subpage for subpage 2
Page 2
Page 3

it works tryed in my server - http://www.e-sstonia.ee/demo/
themes/yourtheme/templates/Includes/Navigation.ss

In your Layout.css line 483 where is - ul#menu - remove overflow:hidden;
also find line: ul#menu :hover ul li a - and change the width for something biger then the drop down will be wider @ moment its 95px change like 125px then your Fostering Application menu will be in one line;