ok, this is my first drop down menu layout, & it took me like 3 hrs to finaly figure out all the codes, i know it's not my best work, but i hope you like it anyway.

paste this into your header

<style type=text/css>/* edit to your liking */table.module { border: 1px solid #000000; width:160px; background-color:000000; }table.module th { background-color: #000000;font: bold 11px arial; text-transform: uppercase;color: #ff0000; border: none; }table.module td {color: #ff0000; text-align: justify; border: none; background-image: none; }</style><!-- add this below all the CSS --><table border=0 width="520"><tr><td valign="top" width="160"><table border="1" cellspacing="0" cellpadding="4" width="100%" class="module"><tr><th valign="top" align="center" class="module"><b></b></th></tr><tr><td valign="top" class="module"> <style type="text/css">.menutitle{cursor:pointer;margin-bottom: 5px;background-color:#000000;font color:#FFFF00color:#666;width:520px;padding:2px;text-align:center;font-weight:bold;/*/*/border:0px solid #000000;/* */}.submenu{margin-bottom: 0.5em;}</style><script type="text/javascript">if (document.getElementById){ //DynamicDrive.com changedocument.write('<style type="text/css">\n')document.write('.submenu{display: none;}\n')document.write('</style>\n')}function SwitchMenu(obj){ if(document.getElementById){ var el = document.getElementById(obj); var ar = document.getElementById("masterdiv").getElementsByTagName("span"); //DynamicDrive.com change if(el.style.display != "block"){ //DynamicDrive.com change for (var i=0; i<ar.length; i++){ if (ar[i].className=="submenu") //DynamicDrive.com change ar[i].style.display = "none"; } el.style.display = "block"; }else{ el.style.display = "none"; } }}</script><!-- Keep all menus within masterdiv--><div id="masterdiv"> <div class="menutitle" onclick="SwitchMenu('sub1')">Superhero Biography</div> <span class="submenu" id="sub1"><center><font color=ffffff> ---------------type about your self here----------</font color></center> </span> <div class="menutitle" onclick="SwitchMenu('sub2')">Crime Scene Snap Shots</div> <span class="submenu" id="sub2"> <marquee width="130" scrollamount="2"> <b></b></marquee><br><br><MARQUEE behavior=alternate> <MARQUEE width=200><font color = ffffff> ---------------------ADD YOUR FAV ICONS HERE!<img src="URL HERE"> <img src="URL HERE"> <img src="URL HERE"> <img src="URL HERE"> <img src="URL HERE"> </font color></MARQUEE></MARQUEE><script></script> </span> <div class="menutitle" onclick="SwitchMenu('sub3')">The Sidekick</div> <span class="submenu" id="sub3"> <center><font color=ffffff>this killer layout was made by <a href="http://www.xanga.com/basement_show_layouts">basement show layouts</a><center><a href="http://www.xanga.com/basement_show_layouts"> <img src="http://tinypic.com/a1slzc.gif" border=0></a></font color></center> </span> <div class="menutitle" onclick="SwitchMenu('sub4')"><font color=FF0000>City Map</font color></div> <span class="submenu" id="sub4"> <a href="http://www.xanga.com/">.com</a> - <a href="http://www.xanga.com/Private/SubscribeTo.aspx?user=YOURUSERNAMEHERE">join my fan club</a> - <a href="http://www.xanga.com/claf">reconstruction</a> - <a href="http://www.xanga.com/private">back to the batcave</a> - <a href="http://www.xanga.com/private/subs.aspx">sidekicks</a> - <a href="http://www.xanga.com/logout.aspx">change identity</a> </span> </div></td></tr></table><br></td><center><font style=" font-size: 38px; TEXT-TRANSFORM: none; COLOR: #ff0000; LINE-HEIGHT: 18px; FONT-FAMILY: times new roman; LETTER-SPACING: -5px">nun nun nun nun nun nun</FONT><br><font style=" font-size: 48px; TEXT-TRANSFORM: none; COLOR: #ffff00; LINE-HEIGHT: 22px; FONT-FAMILY: nono type; LETTER-SPACING: -5px">BATMAN!</center></FONT><br><style type="text/css"> table.navigation, table.left, table.search, #SearchBar1_pnlYouAreHere, {display: none;}body { scrollbar-arrow-color: #ffffff; scrollbar-track-color: #000000; scrollbar-shadow-color: #000000; scrollbar-face-color: #000000; scrollbar-highlight-color: #ffffff; scrollbar-darkshadow-color: #000000; scrollbar-3dlight-color: #000000; background-color:#000000; background-image: url(http://img294.imageshack.us/img294/814/i93592088602185je.gif); background-attachment: fixed; background-position: bottom right; background-repeat: no-repeat;} .left, .blogbody, table.footer, .standard, .leftmodulefontcolor, td, p { /* edits main text */ font:normal 11px terminal; line-height:11px; color:ff0000; letter-spacing:0px; text-align:left; } b, strong{color: #E57625;letter-spacing: -1px;font: bold 11px arial;text-transform: uppercase;} table.left i, .blogbody i, .standard i, a:link i, a:visited i, .footernav.link i, a.footernav:link i, a.footernav:active i, p i, em {/* edits italic text in your entry */font-weight: italic;color:#990000;line-height: 12px;}.blogbody u, p u, u {/* edits underlined text in your entry */font-weight: underlined;border-bottom:solid 2px #C73D3B; color:#990000;font-family: terminal;font-size:11px;text-transform: none;line-height: 12px;letter-spacing: -1px;}table.footer TD { /* this makes the footer at the bottom centered */ /* leave it alone unless you know what to do*/ text-align: center; display:none;} div.blogheader, .caption { /* edits the dates */ width: 180px;font:normal 11px terminal; text-transform:uppercase; border:1px solid #transparent; line-height:12px; font-weight:none; color:#990000; letter-spacing:1px; background-color: transparent; text-align: center; width:200px; } a:link, .footernav.link, a.footernav:link, a.footernav:active { /* edits all links */ color:#ffffff; font:normal 6px terminal; line-height:12px; text-transform: uppercase; text-decoration: none; letter-spacing: 1px; background-color:transparent} a:visited, a.footernav:visited, { /* edits the links that the user has visited */ color:#ffffff; font:normal 6px terminal; line-height:12px; text-transform: uppercase; text-decoration: none; letter-spacing: 1px; background-color:transperent} a:hover { /* edits when user mouseovers the links */ color:ffffff; font:normal 6px terminal; line-height:12px; text-transform: uppercase; text-decoration: none; letter-spacing: 0px; background-color:#transparent; border-bottom: 1px solid #000000; } input, select, textarea, .textfield, .button { /* this edits the buttons, dropdowns, etc. */ border: 1px solid #ff33ff; color:0066ff; font:normal 6px terminal; line-height:11px; text-transform: uppercase; text-decoration: none; letter-spacing: 1px; background-color:#transparent; } table.left { /* this edits the menu module */ border: none; width:150px; background-color: transparent; background-image: url(); } table.blogbody { /* this edits the other the place where the blog is */ border-top: none; background-color: transparent; width:250px; border-left:0px solid #transparent; border-right:0px solid #transparent; border-bottom: 0px solid #transparent; } table.left th { /* on your menu module, this edits the title part of it */ /* like BLOGRINGS, POSTING CALENDAR, etc */ display:none; } table.left TD { /* on your menu module, this edits the body part of it */ background-color: transparent; border: NONE; text-align: center; background-image: url(); } table.search TD, table.search, table.announcements { /* border of search bar (if you have it) */ background-color: ##008158; border: 1px solid #000000; } table.search TD, table.announcements TH { /* this should be left alone */ /* unless you know what to do */ border: none; } table.navigation, table.main, table.footer { /* the width of your blog with modules */ width: 180px; } hr { /* horizontal divider */ border: 1px solid #008158; } </style></center>

and this into your webstats

<!--AdRemover--><BR></TABLE></TD></TR></TR></TD></TABLE><BR><ILAYER name=""><DIV id="" style="BACKGROUND: none transparent scroll repeat 0% 0%; FILTER: alpha(opacity=0); OVERFLOW: auto; WIDTH: 1px; HEIGHT: 1px"><BR><ILAYER name=""><DIV id="" style="BACKGROUND: none transparent scroll repeat 0% 0%; FILTER: alpha(opacity=0); OVERFLOW: auto; WIDTH: 1px; HEIGHT: 1px"><BR><!--Finished--><BR>&lt;</TABLE></TD></TR></TR></TD></TABLE><ILAYER name=""> <DIV id="" style="BACKGROUND: none transparent scroll repeat 0% 0%; FILTER: alpha(opacity=0); OVERFLOW: auto; WIDTH: 1px; HEIGHT: 1px"><ILAYER name=""><DIV id="" style="BACKGROUND: none transparent scroll repeat 0% 0%; FILTER: alpha(opacity=0); OVERFLOW: auto; WIDTH: 1px; HEIGHT: 1px">