DREAMWEAVER CS4 - question about AP Div layers problems - Web Design Scripts & Software

September 13, 200916 yr

:sorry:

Here is some background information:

I am using Dreamweaver CS4 as my only web design software.

I have created a site of 20 pages.

The navigation is inside a table which itself is inside an AP Div layer (as it makes for better maneuverability around the page).

I have used this same navigation table across all 20 pages.

The table looks fine within Dreamweaver but when previewed in the browser all the rows are squashed together and appear to be beneath the last row. Therefore only the last row of the 20 rows of that table is visible.

I do not know what settings I have made to cause this as it was working fine not so long ago. I do recall tweeking something but I cannot reverse it now.

Help please!

Will post codes up below.

Many thanks.

September 13, 200916 yr

Author

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<head>

<title>DERBY HINDU MANDIR GEETA BHAWAN</title>

<!--

#middle {

position:absolute;

width:475px;

height:277px;

z-index:1;

left: 398px;

top: 139px;

}

.style6 {

color: #FFFFFF;

font-family: Verdana, Arial, Helvetica, sans-serif;

}

.style7 {

font-size: 16px;

color: #FEAD01;

font-weight: bold;

}

.style8 {color: #FFFF00; }

.style9 {

font-size: 24px;

color: #FF9C6C;

font-style: italic;

font-weight: bold;

}

#Layer1 {

position:absolute;

width:108px;

height:115px;

z-index:2;

left: 439px;

top: 6px;

}

#Layer2 {

position:absolute;

width:221px;

height:42px;

z-index:2;

left: -209px;

top: 375px;

}

.style12 {color: #00FF33; font-size: xx-small; font-family: Verdana, Arial, Helvetica, sans-serif; }

#blackborder {

position:absolute;

width:8px;

height:510px;

z-index:2;

left: 784px;

top: 135px;

background-color: #220103;

}

#orangeborder {

position:absolute;

width:9px;

height:374px;

z-index:3;

left: 787px;

top: 137px;

background-color: #FF080E;

}

#Layer3 {

position:absolute;

width:791px;

height:106px;

z-index:4;

left: 2px;

top: 643px;

visibility: visible;

}

#Layer4 {

position:absolute;

width:200px;

height:115px;

z-index:5;

}

#god1 {

position:absolute;

width:120px;

height:326px;

z-index:5;

left: 662px;

top: 137px;

}

body {

background-color: #FFFFFF;

}

a:hover {

color: #0FF;

}

#thought {

position:absolute;

width:106px;

height:26px;

z-index:6;

left: -10px;

top: 441px;

}

#Layer6 {

position:absolute;

width:200px;

height:115px;

z-index:34;

left: -198px;

top: 136px;

}

#Layer7 {

position:absolute;

width:144px;

height:115px;

z-index:35;

left: 0px;

top: 139px;

}

#Layer8 {

position:absolute;

width:200px;

height:50px;

z-index:36;

left: 581px;

top: 354px;

}

#Layer9 {

position:absolute;

width:94px;

height:34px;

z-index:37;

left: 143px;

top: 551px;

}

.style13 {

color: #00FF00;

font-weight: bold;

}

#Layer10 {

position:absolute;

width:73px;

height:62px;

z-index:37;

left: 172px;

top: 229px;

}

.style15 {color: #00FF00; font-weight: bold; font-size: 12px; }

#Layer11 {

position:absolute;

width:88px;

height:66px;

z-index:38;

left: 164px;

top: 328px;

}

a:link {

color: #FF0;

}

.style17 {color: #00FFFF; font-weight: bold; font-size: 12px; }

#SEO {

position:absolute;

width:177px;

height:31px;

z-index:39;

left: 614px;

top: 585px;

}

.style18 {color: #FF0000}

body,td,th {

font-size: 11px;

color: #FF0;

position: absolute;

left: auto;

top: auto;

right: auto;

bottom: auto;

clip: rect(auto,auto,auto,auto);

}

a {

font-weight: bold;

font-size: 11px;

}

#apDiv1 {

position:absolute;

width:146px;

height:48px;

z-index:39;

left: 321px;

top: -49px;

}

#apDiv2 {

position:absolute;

width:200px;

height:97px;

z-index:39;

left: 577px;

top: 160px;

}

#apDiv3 {

position:absolute;

width:56px;

height:37px;

z-index:1;

left: -287px;

top: -2px;

}

#apDiv4 {

position:absolute;

width:367px;

height:115px;

z-index:40;

left: 198px;

top: 156px;

}

#apDiv5 {

position:absolute;

width:200px;

height:115px;

z-index:41;

left: 168px;

top: 436px;

}

#apDiv6 {

position:absolute;

width:200px;

height:115px;

z-index:41;

left: 578px;

top: 465px;

}

#apDiv7 {

position:absolute;

width:46px;

height:43px;

z-index:42;

left: 149px;

top: -41px;

}

#apDiv8 {

position:absolute;

width:155px;

height:115px;

z-index:42;

left: 216px;

top: 490px;

}

#apDiv9 {

position:absolute;

width:116;

height:23px;

z-index:43;

left: 161px;

top: 430px;

}

#apDiv10 {

position:absolute;

width:200px;

height:115px;

z-index:44;

left: 179px;

top: 426px;

}

#apDiv11 {

position:absolute;

width:153px;

height:115px;

z-index:43;

left: -1px;

top: 133px;

}

.style131 {color: #00FF00;

font-weight: bold;

font-size: 13px;

}

#Layer {

position:absolute;

width:77px;

height:72px;

z-index:37;

left: 360px;

top: 682px;

}

-->

</style>

</head>

</tr>

</table>

<div align="center"><span class="style12">Website designed & maintained by </span>

</div>

<div align="center"><span class="style12"> Meera Lynn (formerly Shah)<br />

Copywright owned by Derby Hindu Mandir</span></div>

</div>

<div id="Layer5" style="position: absolute; left: 5px; top: -19px; width: 140px; height: 16px; z-index: 1; background: #220103;HOME

<td width="308" height="55" nowrap="nowrap" id="logo" valign="bottom">DERBY HINDU MANDIR</td>

</tr>

<td height="54" nowrap="nowrap" id="tagline" valign="top">Pear Tree Road, Derby </td>

</tr>

</tr>

</tr>

</tr>

</tr>

</tr>

</tr>

</tr>

</table>

</div>

<tr>

<th width="348" height="22" valign="top" scope="col"><p align="left" class="subHeader style6"><span class="pageName">OM NAMAHA SHIVA</span><br />

</p>

<p align="left" class="subHeader style6"> You are most welcomed to the Derby Hindu Mandir website. </p>

<p align="left" class="pageName"><u>Thought of the day:</u></p>

<p align="left" class="subHeader style6">Illness is not cured by saying the word "medicine," but by taking medicine. Enlightenment is not achieved by repeating the word "God" but by directly experiencing God.</p>

Jai Shri Krishna</strong></span></p>

</tr>

</table>

</div>

</div>

<tr>

</tr>

<tr>

<br />

</tr>

<tr>

</tr>

<tr>

<td><a href="trustees.html" target="_self" class="style8"><u> TRUSTEES</u></a></td>

</tr>

<tr>

<td><a href="openinghours.html" class="style8">OPENING HOURS</a></td>

</tr>

<tr>

<td><a href="aartitimetable.html" target="_self" class="style8"> AARTI TIMETABLE</a></td>

</tr>

<tr>

<td><a href="events.html" target="_self" class="style8">EVENTS AT THE MANDIR</a></td>

</tr>

<tr>

<td><a href="language.html" target="_self" class="style8">LANGUAGE CLASSES</a></td>

</tr>

<tr>

<td><a href="yogaclasses.html" target="_self" class="style8">YOGA CLASSES </a></td>

</tr>

<tr>

<td><strong><a href="hallhire.html" target="_self" class="style8">HALL HIRE/MARRIAGE</a></strong></td>

</tr>

<tr>

<td><strong>NEWSLETTER</strong></td>

</tr>

<tr>

<td><a href="announcements.html" class="style8"><strong>ANNOUNCEMENTS</strong></a></td>

</tr>

<tr>

</tr>

<tr>

<td><strong><a href="photoalbum.html" class="style8">PHOTO ALBUM</a></strong></td>

</tr>

<tr>

<td><strong><a href="hinducalendar.html" target="_self" class="style8">HINDU CALENDAR</a></strong></td>

</tr>

<tr>

<td><a href="thoughtoftheday.html" target="_self" class="style8">THOUGHT OF THE DAY</a></td>

</tr>

<tr>

<td><a href="guestbook.html" class="style8">GUESTBOOK</a></td>

</tr>

<tr>

<td><a href="contact.html" class="style8">CONTACT US</a></td>

</tr>

<tr>

<td><strong><a href="ukculturalevents.html" class="style8">UK CULTURAL EVENTS</a></strong></td>

</tr>

<tr>

<td nowrap="nowrap"><strong><a href="localbusinesssupport.html" class="style8">LOCAL BUSINESS SUPPORT </a></strong></td>

</tr>

<tr>

<td><strong><a href="links.html" target="_blank" class="style8">LINKS</a></strong></td>

</tr>

<tr>

<td align="center" valign="middle"><div align="left"> <strong>RECENT EVENTS</strong><a href="photoalbum.html?action=view&current=5a8cc37d.pbw" target="_blank"><img src="durgamaagarbaa1" alt="Durgaa Maa Na Garba April 2009" width="100" height="116" border="2" align="absmiddle" /></a></div></td>

</tr>

</table>

</div>

</body>

</html>

September 13, 200916 yr

Use this validator http://validator.w3.org/ and correct your errors first.

September 13, 200916 yr

Author

I perhaps ought to have mentioned that what I have pasted above is from Dreamweaver and the page is not on the net, so the validator is of no use to me for the time being Wickham - but thanks for the input.

September 13, 200916 yr

You can use that validator to upload from your computer so the page doesn't have to be online. You have some important errors to correct before you can really sort out the other problems.

September 13, 200916 yr

The third tab on the validator page says - "Validate by Direct Input"

Copy and paste your html into that and run the validator!

lines 9,10,11 need the meta tags closing e.g /> at the end of the line

<meta name="keywords" content="Derby Hindu Temple, Derby Hindu Mandir, Derby, Hindu, Mandir, UK, England, Shiva, Sharma, Derbyshire, Pear Tree, pear tree, indian, Hinduism, bhajan, bhojan, Hanuman, Chalisa, krishna, yoga, language classes, charities, hall hire, weddings, hanuman, geeta bhawan, geeta, bhawan, meera shah, meera, shah"/>
<meta name="description" content="Welcome to Derby Hindu Mandir, Pear Tree Road, Derby, DE23 6QA, Derbyshire, UK"/>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"/>

Rather than use tables to layout your menu look at using lists e.g.

<div id="nav">

<ul>
<li><a href="link">Item 1</a></li>
<li><a href="link">Item 2</a></li>
<li><a href="link">Item 3</a></li>
....
</ul>
</div>

DREAMWEAVER CS4 - question about AP Div layers problems

Featured Replies

Create an account or sign in to comment

Recently Browsing 0

Member Statistics

Forum Statistics

Join WDF

Account

Navigation

Search

Configure browser push notifications

Chrome (Android)

Chrome (Desktop)

Safari (iOS 16.4+)

Safari (macOS)

Edge (Android)

Edge (Desktop)

Firefox (Android)

Firefox (Desktop)