jickimojo

I have a css design up at Jacksons Home and Garden "Mastering the Art of Living Well"
The problem that I am having is that when the page is being renedered it draws the layers and then when it is done loading it moves them to the center where they are supposed to be.

How can I get it to render where it is supposed to be and not jump?

I am using the pVII for dreamweaver to position it.

Here is a clip of the css.
<style>
input, form { font-size:9px; }
</style>
<style type="text/css">
<!--
#Layer1 {
position:absolute;
left:107px;
top:21px;
width:790px;
height:518px;
z-index:1;
background-color: #FFFFFF;
overflow: auto;

}
#Layer2 {
position:absolute;
left:117px;
top:33px;
width:768px;
height:494px;
z-index:2;
}
#Layer3 {
position:absolute;
left:118px;
top:34px;
width:768px;
height:75px;
z-index:3;
background-image: url(../grillstore/css/images/headerback.jpg);
overflow: visible;
}
#Layer4 {
position:absolute;
left:118px;
top:110px;
width:768px;
height:40px;
z-index:4;
background-color: #CDD7B7;
}
#Layer5 {
position:absolute;
left:752px;
top:110px;
width:134px;
height:40px;
z-index:5;
background-color: #89A358;
}
#Layer6 {
position:absolute;
left:118px;
top:151px;
width:768px;
height:379px;
z-index:6;
}
#Layer7 {
position:absolute;
left:117px;
top:110px;
width:768px;
height:40px;
z-index:7;
overflow: auto;
}
#Layer8 {
position:absolute;
left:117px;
top:110px;
width:768px;
height:40px;
z-index:7;
}
body {
background-color: #CDD7B7;
text-align:center;
}


#layout { margin-left:auto; margin-right:auto; }

#Layer9 {
position:absolute;
left:650px;
top:37px;
width:235px;
height:23px;
z-index:7;
}
#Layer10 {
position:absolute;
left:688px;
top:74px;
width:172px;
height:22px;
z-index:8;
}
#Layer11 {
position:absolute;
left:704px;
top:110px;
width:150px;
height:40px;
z-index:9;
background-image: url(../grillstore/css/images/headerback.jpg);
}
.style1 {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color: #333333;
}
.style2 {color: #666666}
#Layer12 {
position:absolute;
left:103px;
top:547px;
width:794px;
height:80px;
z-index:10;
}
.style6 {
font-size: 9px;
color: #333333;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-weight: bold;
}
.style9 {font-size: 10px; color: #DAE2CD; font-family: Verdana, Arial, Helvetica, sans-serif;}
.style12 {font-size: 9px; color: #89A358; font-family: Verdana, Arial, Helvetica, sans-serif;}
-->
</style>

phiber

Hmm, seem to load and render fine for me.

Johnny

__________________
Freelance Community
http://www.freelancelounge.com

administrator

Very nice site. It also loads and renders fine in both IE and FireFox