Deamweaver using Fireworks

I am setting up a web page that has a drop down menu made with fireworks. The menu works great but when i put the menu in a layer it changes is function. The menu works like this  
Menu               ****           But with layers it works like this       ****       Menu
        menu-1                                                                                        
        menu-2
        menu-3
                                                                                                                         menu-1
                                                                                                                         menu-2
                                                                                                                         menu-3
Why does it drop down so far when i use layers.
Thank you.
 
jodyreidIT ManagerAsked:
Who is Participating?

[Product update] Infrastructure Analysis Tool is now available with Business Accounts.Learn More

x
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Jason C. LevineDon't talk to me.Commented:
Hi jodyreid,

Without the source code, I can only guess but my guess is that the layer is defined with a position (either relative or absolute) and fireworks menu also a position definition that is screwing things up.
jodyreidIT ManagerAuthor Commented:
<cfquery name="AprCalData" datasource="Calendar">
SELECT *
FROM April2005</cfquery>

<html><head>
<!-- TemplateParam name="OptionalRegion1" type="boolean" value="true" -->
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.style6 {
      font-size: 14px;
      color: #115542;
}
-->
</style>
<script language="JavaScript" type="text/JavaScript"
>function mmLoadMenus() {
  if (window.mm_menu_0405094730_0) return;
  window.mm_menu_0405094730_0 = new Menu("root",150,24,"Times New Roman, Times, serif",18,"#ffff33","#ff0000","#59a48d","#59a48d","center","middle",3,0,100,-5,7,true,true,true,0,false,true);
  mm_menu_0405094730_0.addMenuItem("January&nbsp;2005","window.open('http://localhost:8500/Calendar/2005/Jan2005/January2005.cfm', '_self');");
  mm_menu_0405094730_0.addMenuItem("February&nbsp;2005","location='http://localhost:8500/Calendar/2005/Feb2005/February2005.cfm'");
  mm_menu_0405094730_0.addMenuItem("March&nbsp;2005","location='http://localhost:8500/Calendar/2005/Mar2005/March2005.cfm'");
  mm_menu_0405094730_0.addMenuItem("April&nbsp;2005","location='http://localhost:8500/Calendar/2005/Apr2005/April2005.cfm'");
  mm_menu_0405094730_0.addMenuItem("May&nbsp;2005","location='http://localhost:8500/Calendar/2005/May2005/May2005.cfm'");
  mm_menu_0405094730_0.addMenuItem("June&nbsp;2005","location='http://localhost:8500/Calendar/2005/June2005/June2005.cfm'");
  mm_menu_0405094730_0.addMenuItem("July&nbsp;2005","location='http://localhost:8500/Calendar/2005/July2005/July2005.cfm'");
  mm_menu_0405094730_0.addMenuItem("August&nbsp;2005","location='http://localhost:8500/Calendar/2005/Aug2005/August2005.cfm'");
  mm_menu_0405094730_0.addMenuItem("September&nbsp;2005","location='http://localhost:8500/Calendar/2005/Sept2005/September2005.cfm'");
  mm_menu_0405094730_0.addMenuItem("October&nbsp;2005","location='http://localhost:8500/Calendar/2005/Oct2005/October2005.cfm'");
  mm_menu_0405094730_0.addMenuItem("November&nbsp;2005","location='http://localhost:8500/Calendar/2005/Nov2005/November2005.cfm'");
  mm_menu_0405094730_0.addMenuItem("December&nbsp;2005","location='http://localhost:8500/Calendar/2005/Dec2005/December2005.cfm'");
   mm_menu_0405094730_0.hideOnMouseOut=true;
   mm_menu_0405094730_0.menuBorder=0;
   mm_menu_0405094730_0.menuLiteBgColor='#00ffff';
   mm_menu_0405094730_0.menuBorderBgColor='#59a48d';
   mm_menu_0405094730_0.bgColor='#ffffff';

  window.mm_menu_0405144601_0 = new Menu("root",75,24,"Times New Roman, Times, serif",18,"#ffff33","#ff0000","#59a48d","#59a48d","left","middle",3,0,100,-5,7,true,true,true,0,false,true);
  mm_menu_0405144601_0.addMenuItem("Januray","window.open('http://localhost:8500/Calendar/2005/Jan2005/January2005.cfm', '_parent');");
   mm_menu_0405144601_0.hideOnMouseOut=true;
   mm_menu_0405144601_0.menuBorder=0;
   mm_menu_0405144601_0.menuLiteBgColor='#00ffff';
   mm_menu_0405144601_0.menuBorderBgColor='#59a48d';
   mm_menu_0405144601_0.bgColor='#ffffff';

  mm_menu_0405144601_0.writeMenus();
} // mmLoadMenus()<!--
function MM_reloadPage(init) {  //reloads the window if Nav4 resized
  if (init==true) with (navigator) {if ((appName=="Netscape")&&(parseInt(appVersion)==4)) {
    document.MM_pgW=innerWidth; document.MM_pgH=innerHeight; onresize=MM_reloadPage; }}
  else if (innerWidth!=document.MM_pgW || innerHeight!=document.MM_pgH) location.reload();
}
MM_reloadPage(true);
//-->
</script>
<script language="JavaScript1.2" src="2005/mm_menu.js"></script>
</head><META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<META name="description" content=>
<META name="keywords" content=>
<title>default: April 2005</title> <style type="text/css">

<!--

/* CSS for calendar C:\Program Files\iCal v3.10 Web Calendar\AprData\default.cal  */
body.bodyclass{ font-weight:normal; font-size:12px;color:#000000;background-color:#CDF2D7;}
.tdcalendartitle{ font-weight:normal; font-size:x-large; font-family:Arial;color:yellow;background-color:darkgreen;text-align:center;}
.calendarmonthyear{ font-weight:bold; font-size:x-large; font-family:Arial;color:black;background-color:#CDF2D7;text-align:center;}
.tdcalendarheader{ font-weight:normal;color:black;background-color:navajowhite;}
.tdcalendarfooter{ font-weight:normal;color:#000000;background-color:#BBFFBB;}
.tdlistymtitle{ font-weight:normal; font-size:20px; font-family:Arial;color:#000000;background-color:#CDF2D7;}
A.tdlistymtitle_link{ font-size:20px; text-decoration:underline;color:#000000;}
.navigatebar_bgcolor{background-color:#97A68D;}
.navigatebar_labels{ font-weight:bold; font-size:x-small; font-family:Arial;color:black;background-color:#97A68D;}
.navigatebar_year{ font-weight:normal; font-size:12px; font-family:Arial;color:black;text-align:center;background-color:#97A68D;}
A.navigatebar_year_link{ font-weight:normal; text-decoration:underline; font-size:12px; font-family:Arial;color:black;background-color:#97A68D;}
.navigatebar_monthweek{ font-weight:normal; font-size:12px; font-family:Arial;color:black;text-align:center;background-color:#97A68D;}
.navigatebar_monthweek_selected{ font-weight:bold; font-size:12px; font-family:Arial;color:black;text-align:center;background-color:#CCCCCC;}
A.navigatebar_monthweek_link{ font-weight:normal; font-size:12px; text-decoration:underline; font-family:Arial;color:black;background-color:#97A68D;}
.displaybar_bgcolorleft{text-align:left;background-color:#97A68D;}
.displaybar_bgcolorright{text-align:right;background-color:#97A68D;}
.displaybar_bgcolor{
      text-align:left;
      background-color:#97A68D;
      color: #FFFF66;
}
.displaybar_textelement{ font-weight:normal; font-size:12px; font-family:Arial;color:black;background-color:#97A68D;text-align:center;white-space:nowrap;}
.displaybar_selected{ font-weight:bold; font-size:12px; font-family:Arial;color:black;background-color:#CCCCCC;text-align:center;}
A.displaybar_textelement_link{ font-weight:normal; font-size:12px; text-decoration:underline;white-space:nowrap; font-family:Arial;color:black;background-color:#97A68D;}
select.navbarselect{color:black;background-color:#CCCCCC;}
.weekdayheadings{ font-weight:normal; font-size:medium; font-family:Arial;color:#FFFFFF;background-color:#0D0D0D;text-align:center;}
.prevnextmonth{ font-weight:normal; font-size:medium; font-family:Arial;color:#FFFFFF;background-color:#0D0D0D;text-align:center;}
A.prevnextmonth_link{ font-size:medium; text-decoration:underline;color:#FFFFFF;background-color:#0D0D0D;}
A.subscribelink{ font-weight:normal; text-decoration:underline; font-size:medium; font-family:Arial;color:black;text-align:left;}
A.outlookaddlink{ font-weight:normal; text-decoration:underline; font-size:medium; font-family:Arial;color:black;text-align:left;}
.offmonthbg{background-color:#336600;text-align:left;}
.blockdefaultmonthbg{background-color:#FFFF66;text-align:left;}
.listdefaultmonthbg{background-color:#BBBBBB;text-align:left;vertical-align:top;}
.timeplanmonthbg{background-color:#BBBBBB;text-align:left;vertical-align:top;}
.timeplanmonthbgshadow{background-color:#BBBBBB;text-align:left;vertical-align:top; border-top: outset; border-right: outset; border-bottom: outset; border-left: outset; border-top-width: 1px; border-right-width: 2px; border-bottom-width: 2px; border-left-width: 1px; }
.dayofmonth{background-color:#CDF2D7;color:#0D0D0D;text-align:left;}
A.dayofmonth_link{ font-weight:normal; font-size:medium; text-decoration:underline; font-family:Arial;color:#000000;background-color:#CDF2D7;text-align:left;}
A.listdatelink{ font-weight:normal; text-decoration:underline; font-size:medium; font-family:Arial;color:#000000;background-color:#BBBBBB;text-align:left;}
A.listeventlink{ font-weight:normal;text-align:left; text-decoration:underline; font-size:12px; font-family:Arial;color:#0D0D0D;background-color:#BBBBBB;}
.todaysdate{background-color:limegreen;text-align:left;}
A.todaysdate_link{ font-weight:normal; text-decoration:underline; font-size:medium; font-family:Arial;color:#FFFFFF;background-color:limegreen;text-align:left;}
.calendarevent{ font-weight:normal; font-size:12px; font-family:Arial; font-style:normal;color:#000000;}
.listcalendarevent{ font-weight:normal; font-size:12px; font-family:Arial; font-style:normal;color:#000000;}
.fonttime{ font-weight:normal; font-style:normal; font-size:xx-small; font-family:Arial;color:#000000;}
A.eventlink{ font-weight:normal;text-align:left; text-decoration:underline; font-size:12px; font-family:Arial;color:#0D0D0D;background-color:#BBBBBB;}
A.offeventlink{ font-weight:normal;text-align:left; text-decoration:underline; font-size:12px; font-family:Arial;color:#0D0D0D;background-color:#8DA694;}
.weeknumber{ font-weight:normal; font-style:normal; font-size:12px; font-family:Arial;color:#000000;text-align:left;}
.listshortdaytext{ font-weight:normal; font-style:normal; font-size:small; font-family:Arial;color:#000000;background-color:#CDF2D7;text-align:center;vertical-align:top;}
.listlabeltext{ font-weight:normal; font-style:normal; font-size:xx-small; font-family:Arial;color:#000000;}
.quickfilter_left{ font-weight:bold; font-style:normal; font-size:small; font-family:Verdana, Arial, Helvetica, sans-serif;color:white;background-color:black;text-align:left;}
.quickfilter_right{ font-weight:bold; font-style:normal; font-size:small; font-family:Verdana, Arial, Helvetica, sans-serif;color:white;background-color:black;text-align:right;}
A.quickfilter_link{ font-family:Verdana, Arial, Helvetica, sans-serif; font-size:small; text-decoration:underline;color:white;}
.blockyearfullmonth{ font-weight:normal; font-style:normal; font-size:small; font-family:Verdana, Arial, Helvetica, sans-serif;color:black;background-color:#888888;text-align:center;}
A.blockyearfullmonthlink{ font-weight:normal; text-decoration:underline; font-style:normal; font-size:small; font-family:Verdana, Arial, Helvetica, sans-serif;color:black;background-color:#888888;}
.blockyearmonthtitle{background-color:#0D0D0D;text-align:center;}
A.blockyearmonthtitlelink{ font-weight:bold; font-style:normal; text-decoration:underline; font-size:small; font-family:Verdana, Arial, Helvetica, sans-serif;color:#FFFFFF;background-color:#0D0D0D;text-align:center;}
.blockyearasterisk{ font-weight:normal; font-style:normal; font-size:xx-small;text-align:center;}
.blockyearweekday{ font-weight:normal; font-style:normal; font-size:small; font-family:Verdana, Arial, Helvetica, sans-serif;color:#000000;background-color:#CDF2D7;text-align:center;}
.blockyeardaynum{background-color:#BBBBBB;text-align:center;}
A.blockyeardaynumlink{ font-weight:normal; font-style:normal; text-decoration:underline; font-size:small; font-family:Verdana, Arial, Helvetica, sans-serif;color:#000000;background-color:#BBBBBB;text-align:center;}
.blockyearweeknum{background-color:#CDF2D7;text-align:center;}
A.blockyearweeknumlink{ font-weight:normal; font-style:italic; text-decoration:underline; font-size:x-small; font-family:Verdana, Arial, Helvetica, sans-serif;color:#000000;background-color:#CDF2D7;text-align:center;}
.plannerweek{ font-weight:normal; font-style:normal; font-size:medium; font-family:Arial;background-color:#CDF2D7;text-align:left;}
A.plannerweek_link{ font-weight:normal; text-decoration:underline;color:#000000;background-color:#CDF2D7;text-align:left;}
.popbody{background-color:navajowhite;}
.popuptitle{ font-weight:normal; font-style:normal; font-size:medium; font-family:Arial;color:#0000FF;text-align:left;}
.popupdata{ font-weight:normal; font-style:normal; font-size:small; font-family:Arial;color:#0000FF;text-align:left;}
.popupdate{ font-weight:bold; font-style:normal; font-size:x-small;text-align:left;}
.style4 {background-color: #FFFF66; text-align: left; color: #FF0000; }
.style7 {color: #1D04FB}
-->

</style>


</head>
<body class=bodyclass><center>
<div id="Layer1" style="position:absolute; width:75%; height:350px; z-index:4; left: 322px; top: 138px;"></div>
<div id="Layer3" style="position:absolute; width:323px; height:345px; z-index:5; left: 1px; top: 93px;">  
  <div align="left"><a href="#" onMouseOut="MM_startTimeout();" onMouseOver="MM_showMenu(window.mm_menu_0405094730_0,177,30,null,'Menu');">
    <script language="JavaScript1.2">mmLoadMenus();</script>
    </a>
    <table border="0" cellpadding="0" cellspacing="0" width="150">
      <!-- fwtable fwsrc="Menu1.png" fwbase="Menu1.gif" fwstyle="Dreamweaver" fwdocid = "1790405285" fwnested="0" -->
      <tr>
        <td><img src="2005/spacer.gif" width="4" height="1" border="0" alt=""></td>
        <td><img src="2005/spacer.gif" width="138" height="1" border="0" alt=""></td>
        <td><img src="2005/spacer.gif" width="8" height="1" border="0" alt=""></td>
        <td><img src="2005/spacer.gif" width="1" height="1" border="0" alt=""></td>
      </tr>
      <tr>
        <td colspan="3"><img name="Menu1_r1_c1" src="2005/Menu1_r1_c1.gif" width="150" height="5" border="0" alt=""></td>
        <td><img src="2005/spacer.gif" width="1" height="5" border="0" alt=""></td>
      </tr>
      <tr>
        <td rowspan="2"><img name="Menu1_r2_c1" src="2005/Menu1_r2_c1.gif" width="4" height="245" border="0" alt=""></td>
        <td><a href="#" onMouseOut="MM_startTimeout();" onMouseOver="MM_showMenu(window.mm_menu_0405144601_0,139,27,null,'Menu1_r2_c2');"><img name="Menu1_r2_c2" src="2005/Menu1_r2_c2.gif" width="138" height="29" border="0" alt=""></a></td>
        <td rowspan="2"><img name="Menu1_r2_c3" src="2005/Menu1_r2_c3.gif" width="8" height="245" border="0" alt=""></td>
        <td><img src="2005/spacer.gif" width="1" height="29" border="0" alt=""></td>
      </tr>
      <tr>
        <td><img name="Menu1_r3_c2" src="2005/Menu1_r3_c2.gif" width="138" height="216" border="0" alt=""></td>
        <td><img src="2005/spacer.gif" width="1" height="216" border="0" alt=""></td>
      </tr>
    </table>
</div>
</div>
<div id="Layer2" style="position:absolute; width:100%; height:133px; z-index:2; left: 1px; top: 2px;">
  <table  width="100%" height="93"  class=tblcalendartitle>
    <tr>
      <td height="63" colspan=17 class=tdcalendartitle ><div align="center"> Event Calendar </div></td>
    </tr>
  </table>
  <table  width="98%"  class=tblcalendarheader>
  </table>
  <center>
  </center>
  <center>
  </center>

  <center>
</center>
</div>
</body><head><META HTTP-EQUIV="PRAGMA" CONTENT="NO-CACHE"></head></html>
This is the code I am using for the layers and menu.
I do not know if this will help solve my problem.
Thank you.
Jody
jodyreidIT ManagerAuthor Commented:
Can anyone help with this problem. This is the second time i have put this problem in and still can not get an answer. It would help alot if someone could take a look at this problem.
Thank you.
Become a Microsoft Certified Solutions Expert

This course teaches how to install and configure Windows Server 2012 R2.  It is the first step on your path to becoming a Microsoft Certified Solutions Expert (MCSE).

Jason C. LevineDon't talk to me.Commented:
Hi jodyreid,

Sorry about the delay.  I had some RL issues to take care off.

As I noted above, you are using an absolutely positioned layer to hold things and that can have funny effects on nested div tags within that layer.  Also, run your page through the W3 validator (validator.w3.org).   You have a number of errors that could cause browsers to be reverting to quirks mode and that can screw up the display of the elements too.

Finally, can you post a link to the page so I can preview it with images?
jodyreidIT ManagerAuthor Commented:
Thank you. This i think will solve my problem, what do i use instead of the absolutely position for best results.
Thank you.
Jason C. LevineDon't talk to me.Commented:
Use float and clear to control how the elements appear.  It looks like you are already starting down this path from yout source code...you just need to clean things up a bit more.

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Jason C. LevineDon't talk to me.Commented:
Thanks for the points.  Good luck!
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
Adobe Dreamweaver

From novice to tech pro — start learning today.