PDA

View Full Version : Liquid layout issue


Lightstalker01
06-19-2009, 11:03 AM
Hi there,,

Im have a problem with the layout of my website. Ive just started so it it simply comprised of one AP div inside a relatively positioned wrapper div
when I test it in a browser, my div moves from left to right according to how I adjust the browser width, but It doesn't adjust if I change the height of the browser- it stays static. How can I fix this?..
here is an example of a site which adjusts with the width AND the height of the browser. http://www.anastasiataylorlind.com/

Here is my code:

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<style type="text/css">
<!--
#apDiv1 {
position:absolute;
left:0px;
top:0px;
width:800px;
height:500px;
z-index:1;
background-color: #00CC00;
}
body {
position: relative;
width: 800px;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
padding-top: 0px;
padding-left: 0px;
}
-->
</style>
</head>

<body>
<div>
<div id="apDiv1"></div>
</div>
</body>
</html>

Lightstalker01
06-19-2009, 12:12 PM
here is another example of what Im trying to achieve: http://www.ivorprickett.co.uk/
(the main content of the site moves left to right as well as up and down according to the size of the browser)

DWcourse
06-19-2009, 01:09 PM
They used a table (since css doesn't provide a simple solution for centering content vertically) but this http://www.vdotmedia.com/blog/vertically-center-content-with-css/ might help you do it without resorting to tables.

Lightstalker01
06-19-2009, 01:28 PM
Ah, I see.
Thank you mate :)