1) Switch menu 2

2) http://www.dynamicdrive.com/dynamici...witchmenu2.htm

3) I have got the menu working but i don't know how to align it to the left center of the screen. at the moment it is at the top left of the screen.

here is the code that i have got so far:

HTML Code:
<html>

<head>
<meta name="GENERATOR" content="Microsoft FrontPage 5.0">
<meta name="ProgId" content="FrontPage.Editor.Document">
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Demo Menu 1</title>

<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" >

<link rel="stylesheet" type="text/css" href="sddm.css" >
<title>JSwitch Slide Menu</title>

</head>

<body>
<div class="navbar" style="width: 148; height: 253;">
<!-- *********************************Start Menu****************************** -->
<div class="mainDiv" >
<div class="topItem" >Demo Menu 1</div>        
<div class="dropMenu" ><!-- -->
	<div class="subMenu" style="display:inline;">
		<div class="subItem"><a href="#">Configuration</a></div>
	        <div class="subItem"><a href="#">Tool Box</a></div>
		<div class="subItem"><a href="#">Contact Us</a></div>
		<div class="subItem"><a href="#">Sub Menu 4</a></div>
		<div class="subItem"><a href="#">Sub Menu 5</a></div>
	</div>
</div>
</div>
<!-- *********************************End Menu****************************** -->
<br>
<!-- *********************************Start Menu****************************** -->
<div class="mainDiv" >
<div class="topItem"  >Demo Menu 2</div>        
<div class="dropMenu" ><!-- -->
	<div class="subMenu" style="display:none;">
		<div class="subItem"><a href="#">Configuration</a></div>
		<div class="subItem"><a href="#">Sub Menu 2</a></div>
		<div class="subItem"><a href="#">Sub Menu 3</a></div>
		<div class="subItem"><a href="#">Sub Menu 4</a></div>
        </div>
</div>
</div>
<!-- *********************************End Menu****************************** -->
<script type="text/javascript" src="xpmenuv21.js"></script>
</div>

<p>&nbsp;</p>

</body>

</html>