Centering a webpage - Liquid

pritmadlani · Mar 30th, 2008, 23:11

Hi,

I am building a website and would like to make it liquid. The website address is:

http://www.cse.dmu.ac.uk/~p04283218/mainframe9/

Can anyone point me in the right direction as to how I would do this please.

Thanks.

saltedm8 · Mar 30th, 2008, 23:38

you will have to make a container and centre that, then put everything inside that

to create a container you need something like this

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.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">
<!--
#container {
    margin: 0 auto;
    width:600px;
    height:209px;

}
-->
</style>
</head>

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

the 'margin: 0 auto;' is what centres it

then you need to put your content layout within it like so

Code: Select all

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.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">
<!--
#container {
    margin: 0 auto;
    width:600px;
    height:209px;

}

#innerlayout {
    width:40x;
    height:50px;
    margin:5px 5px 0 5px;
}
-->
</style>
</head>

<body>
<div id="container">
<div id="innerlayout"></div>

</div>
</body>
</html>

notice that the div has been removed from next to container and placed below the innerlayout div, this is saying, 'this is what is inside me'

hope that helps to get you started

also have a look here http://www.maxdesign.com.au/presentation/liquid/