I have a working web page that is using layers to position various objects on the page. These objects are all either created or filled in using JavaScript and/or Java applets. I also toggle the visiblity of several of the initial layers, essentually replacing them with new objects.<br />
<br />
Now I have to incorporate the page into a template in order to meet corporate web site standards. This change has caused a number of problems.<br />
<br />
Here is the template that I am using. <br />
<br />
<BODY topmargin="25" leftmargin="5" marginwidth="5" marginheight="25"><br />
<!-- ----------------------Do not remove these include files------------------------------ --><br />
<script type='text/javascript'><br />
function Go(){return}<br />
</script><br />
<script type='text/javascript' src='http://www.webdeveloper.com/forum/archive/index.php/_includes/mainmenu_var1.js'></script><br />
<script type='text/javascript' src='http://www.webdeveloper.com/forum/archive/index.php/_includes/mainmenu_text.js'></script><br />
<script type='text/javascript' src='http://www.webdeveloper.com/forum/archive/index.php/_includes/mainmenu.js'></script><br />
<noscript> Your browser does not support script</noscript><br />
<!-- ------------------------------------------------------------------------------------- --><br />
<table border="0" cellpadding="0" cellspacing="0" width="800" ><br />
<tr valign="top"><br />
<td width="1" valign="top" background="/_images/black_fill.gif"></td><br />
<td width="5" valign="top" background="/_images/clear.gif"></td><br />
<!-- ----------------------------------------------------------------------------------- --> <br />
<!-- Main column starts here. This is where you put your main content. ----------------- --><br />
<!-- Remember! it is 783px wide. If you place your own table or any other -------------- --><br />
<!-- elements here size them less than 780 px!!!!! ------------------------------------- --> <br />
<td width="783" valign="top"><br />
<br />
<!-- !!!!!!!!!!End of your content. Do not make any changes beyong this point!!!!!!!!!! --><br />
<!-- ---------------------------------------------------------------------------------- --><br />
</td><br />
<td width="10" valign="top" background="_images/clear.gif"></td><br />
<td width="1" valign="top" background="_images/black_fill.gif"></td><br />
</tr><br />
<tr><br />
<td width="800" height="20" bgcolor="black" colspan="7"><br />
<!-- #INCLUDE virtual="_includes/footer_nav.htm" --><br />
</td><br />
</tr><br />
<tr><br />
<td background="_images/black_fill.gif" width="800" height="1" colspan="7"></td><br />
</tr><br />
</table><br />
<!-- #INCLUDE VIRTUAL="/_includes/footer_copy.htm" --><br />
</BODY><br />
<br />
The layer layout looks like:<br />
<br />
<br />
--------------------<br />
| | |<br />
| 1 | 2 |<br />
| | |<br />
--------------------<br />
| |<br />
| 3 |<br />
| |<br />
--------------------<br />
<br />
<br />
Problem #1:<br />
My 'form' goes into the middle (3rd of 5) cell in the first row of the table. When the page displays, the last 2 rows are at the top of the page behind the first row with my form. <br />
<br />
Problem #2:<br />
My form loads and displays correctly, but when the user submits their first request, layers 1 and 3 are hidden and layers 4 & 5 are made visible. However, layer 5 (should replace layer 3) does not appear.<br />
<br />
Problem #3:<br />
Layer 2 contains a number of controls, including several select lists. These select lists show through the drop-down menus that are just above the two upper layers. I recall seeing a post somewhere, sometime that dealt with this problem and I am under the impression that there is no fix for this. Is this true?<br />
<br />
So, my question is, how much of problems 1 & 2 points to my use of layers inside the table cell?<!--content-->I always seem to have an epiphany after posting my problem.<br />
<br />
I got to thinking that it appeared as if the browser had no idea as to how high the first row should be and, therefore, where rows 2 & higher should be located. After taking another look at the line <td width="783" valign="top">, I decided to give it a height of 540 (for starters) and that worked. All layers display and rows 2 & higher have moved down.<br />
<br />
Now, the question is: why couldn't the browser figure out where to size/locate the rows?<!--content-->
<br />
Now I have to incorporate the page into a template in order to meet corporate web site standards. This change has caused a number of problems.<br />
<br />
Here is the template that I am using. <br />
<br />
<BODY topmargin="25" leftmargin="5" marginwidth="5" marginheight="25"><br />
<!-- ----------------------Do not remove these include files------------------------------ --><br />
<script type='text/javascript'><br />
function Go(){return}<br />
</script><br />
<script type='text/javascript' src='http://www.webdeveloper.com/forum/archive/index.php/_includes/mainmenu_var1.js'></script><br />
<script type='text/javascript' src='http://www.webdeveloper.com/forum/archive/index.php/_includes/mainmenu_text.js'></script><br />
<script type='text/javascript' src='http://www.webdeveloper.com/forum/archive/index.php/_includes/mainmenu.js'></script><br />
<noscript> Your browser does not support script</noscript><br />
<!-- ------------------------------------------------------------------------------------- --><br />
<table border="0" cellpadding="0" cellspacing="0" width="800" ><br />
<tr valign="top"><br />
<td width="1" valign="top" background="/_images/black_fill.gif"></td><br />
<td width="5" valign="top" background="/_images/clear.gif"></td><br />
<!-- ----------------------------------------------------------------------------------- --> <br />
<!-- Main column starts here. This is where you put your main content. ----------------- --><br />
<!-- Remember! it is 783px wide. If you place your own table or any other -------------- --><br />
<!-- elements here size them less than 780 px!!!!! ------------------------------------- --> <br />
<td width="783" valign="top"><br />
<br />
<!-- !!!!!!!!!!End of your content. Do not make any changes beyong this point!!!!!!!!!! --><br />
<!-- ---------------------------------------------------------------------------------- --><br />
</td><br />
<td width="10" valign="top" background="_images/clear.gif"></td><br />
<td width="1" valign="top" background="_images/black_fill.gif"></td><br />
</tr><br />
<tr><br />
<td width="800" height="20" bgcolor="black" colspan="7"><br />
<!-- #INCLUDE virtual="_includes/footer_nav.htm" --><br />
</td><br />
</tr><br />
<tr><br />
<td background="_images/black_fill.gif" width="800" height="1" colspan="7"></td><br />
</tr><br />
</table><br />
<!-- #INCLUDE VIRTUAL="/_includes/footer_copy.htm" --><br />
</BODY><br />
<br />
The layer layout looks like:<br />
<br />
<br />
--------------------<br />
| | |<br />
| 1 | 2 |<br />
| | |<br />
--------------------<br />
| |<br />
| 3 |<br />
| |<br />
--------------------<br />
<br />
<br />
Problem #1:<br />
My 'form' goes into the middle (3rd of 5) cell in the first row of the table. When the page displays, the last 2 rows are at the top of the page behind the first row with my form. <br />
<br />
Problem #2:<br />
My form loads and displays correctly, but when the user submits their first request, layers 1 and 3 are hidden and layers 4 & 5 are made visible. However, layer 5 (should replace layer 3) does not appear.<br />
<br />
Problem #3:<br />
Layer 2 contains a number of controls, including several select lists. These select lists show through the drop-down menus that are just above the two upper layers. I recall seeing a post somewhere, sometime that dealt with this problem and I am under the impression that there is no fix for this. Is this true?<br />
<br />
So, my question is, how much of problems 1 & 2 points to my use of layers inside the table cell?<!--content-->I always seem to have an epiphany after posting my problem.<br />
<br />
I got to thinking that it appeared as if the browser had no idea as to how high the first row should be and, therefore, where rows 2 & higher should be located. After taking another look at the line <td width="783" valign="top">, I decided to give it a height of 540 (for starters) and that worked. All layers display and rows 2 & higher have moved down.<br />
<br />
Now, the question is: why couldn't the browser figure out where to size/locate the rows?<!--content-->