Supplement

I knew you were going to say that, sucks, but my CSS skills are **** now a days. Here is the psd file. http://www.estheticianweb.com/EW_index.psd

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /> <title>Esthetician Web | Join Today</title> <link rel="stylesheet" type="text/css" href="psd2css.css" media="screen" /> <style type="text/css"> /*give the body height:100% so that its child elements can have percentage heights*/ body{ height:100% } /*this is what we want the div to look like*/ div.fullscreen{ display:block; /*set the div in the top-left corner of the screen*/ position:absolute; top:0; left:0; /*set the width and height to 100% of the screen*/ width:100%; height:100%; } </style> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script> </head> <body> <div class="fullscreen"> <img src="ew_index.png" id="bg" alt="background"> <div id="Layer-17" class=" Provide customer service rat" > <img src="Layer-17.png" width="230" height="141" alt="- Provide customer service rat" class="pngimg" /></div> <div id="Layer-16" class="stellaexcellent 110" > <img src="Layer-16.png" width="104" height="66" alt="stellaexcellent" class="pngimg" /></div> <div id="Layer-15" class="How can we make your life easi" > <img src="Layer-15.png" width="212" height="63" alt="How can we make your life easi" class="pngimg" /></div> <div id="Layer-14" class=" With Esthetician Web you hav" > <p></p> <p>more text here</p></div> <div id="Layer-13" class="Why Esthetician Web" > <center><h1>Why Join Esthetician Web?</h1></center></div> <div id="Layer-12" class="iStock 000011390980Medium" > <img src="Layer-12.png" width="219" height="305" alt="iStock" class="pngimg" /></div> <div id="Layer-11" class="Screen shot 20110727 at 1134" > <a href="http://www.skincareheaven.com"><img src="Layer-11.png" width="256" height="201" alt="Screen shot 2011-07-27 at 1134" class="pngimg" /></a></div> <div id="Layer-10" class=" Skin Care Heaven was founded" > text here</a></p></font></div> <div id="Layer-9" class="Our Skin Care Product Affilia" > <h1>Our Skin Care Product Affiliate</h1></div> <div id="Layer-8" class="Sign up Today for just 199" > <img src="Layer-8.png" width="229" height="87" alt="Sign up Today for just 199" class="pngimg" /></div> <div id="Layer-7" class="Shape 5" > <img src="Layer-7.png" width="118" height="58" alt="Shape 5" class="pngimg" /></div> <!-- This is 'Included - Welcome Package -' --> <div id="Layer-6" class="Included Welcome Package " > <img src="Layer-6.png" width="235" height="177" alt="Included - Welcome Package -" class="pngimg" /></div> <div id="Layer-5" class="Shape 4" > <img src="Layer-5.png" width="784" height="5" alt="Shape 4" class="pngimg" /></div> <div id="Layer-4" class="Shape 3 copy 2" > <img src="Layer-4.png" width="8" height="343" alt="Shape 3 copy 2" class="pngimg" /></div> <div id="Layer-3" class="Shape 3 copy" > <img src="Layer-3.png" width="8" height="343" alt="Shape 3 copy" class="pngimg" /></div> <div id="Layer-2" class="Shape 3" > <img src="Layer-2.png" width="7" height="670" alt="Shape 3" class="pngimg" /></div> </div> </body> </html>

That's strange cause they're working for me. Here is my CSS for everything except the background. body { font-family: Helvetica, sans-serif, Arial; font-size: small; } #Layer-1 { position: absolute; left: +0px; top: +0px; width: 1600px; height: 821px; z-index: 1; } #Layer-2 { position: absolute; left: 550px; top: 118px; width: 7px; height: 668px; z-index: 2; } #Layer-3 { position: absolute; left: 815px; top: 440px; width: 8px; height: 346px; z-index: 3; } #Layer-4 { position: absolute; left: 1087px; top: 440px; width: 8px; height: 346px; z-index: 4; } #Layer-5 { position: absolute; left: 555px; top: 441px; width: 780px; height: 5px; z-index: 5; } #Layer-6 { position: absolute; left: 584px; top: 571px; width: 235px; height: 177px; z-index: 6; } #Layer-7 { position: absolute; left: 642px; top: 491px; width: 118px; height: 58px; z-index: 7; } #Layer-8 { position: absolute; left: 586px; top: 455px; width: 229px; height: 87px; z-index: 8; } #Layer-9 { position: absolute; left: 295px; top: 147px; width: 230px; height: 70px; z-index: 9; } #Layer-10 { position: absolute; left: 292px; top: 244px; width: 236px; height: 242px; z-index: 10; } #Layer-11 { position: absolute; left: 281px; top: 516px; width: 256px; height: 201px; z-index: 11; } #Layer-12 { position: absolute; left: 589px; top: 135px; width: 219px; height: 305px; z-index: 12; } #Layer-13 { position: absolute; left: 747px; top: 155px; width: 313px; height: 33px; z-index: 13; } #Layer-14 { position: absolute; left: 823px; top: 218px; width: 481px; height: 208px; z-index: 14; } #Layer-15 { position: absolute; left: 867px; top: 451px; width: 212px; height: 63px; z-index: 15; } #Layer-16 { position: absolute; left: 921px; top: 533px; width: 104px; height: 66px; z-index: 16; } #Layer-17 { position: absolute; left: 858px; top: 617px; width: 230px; height: 141px; z-index: 17; } a { cursor: pointer; outline: none; } a:link { color: #F88; } a:visited { color: #F88; } a:hover { color: #F00; /* IE */ textarea { overflow: auto; } /* non-IE */ teatarea[name] { overflow: inherit; } } As you can see everything is positioned absolutely, now I'm pretty sure there is better ways of doing it but I'm really rusty. Thanks for the help. =]

Thanks for the reply, I've tried that already. I got two potential fixes that I've come across. I like the more minimal code strategy but having the same problem ultimately with both. http://estheticianweb.com/full/1/index.html'>http://estheticianweb.com/full/1/index.html http://estheticianweb.com/ Whenever you minimize the window the text jumps out of the white space... it's always one thing or another. ack!

Hey guys, I've been coding since 2004, I started out doing design and now I'm into developing and programming... kind of just a rogue coder. I haven't been doing design as much any more so I'm a little behind on my css knowledge and that's why I'm here. =p Cheers!, Tim

Hey guys, new here; I'm having a problem with a bit of css covering a full page. It's working on some screens but not all. I haven't been doing design much in the past couple years so I could use some help. Here's the site: http://estheticianweb.com/ I have a couple ideas in mind of what I might want to do if I can't get this draft working, like resizing at a bigger resolution etc. etc. Right now I'm on a 22inch monitor at 1920 x 1080. It's sitting up in the top left like it's suppose to based on the existing code but i have the width and height set to 100%. <style type="text/css"> body{ height:100% } div.fullscreen{ display:block; position:absolute; top:0; left:0; width:100%; height:100%; } </style>