CSS problem

wewt · 05-09-2007, 06:22 PM

Hey,

I'm trying to get this box to reach the top and bottom of the page. It only shows when I set height: 100px; or something and not 100% which is what I have atm. I'm a bit stuck and was wondering how I can get it to reach the top and bottom with no top and bottom margins.

this is it now (it's not showing)

wewt.co.uk/xy/

#box {
margin-top: 0px;
margin-bottom: 0px;
width: 600px;
background-color: #fff;
min-height: 100%;
margin-right: auto;
margin-left: auto;
}

Aflux · 05-09-2007, 06:29 PM

body {
margin 0 0 0 0px;
}

wewt · 05-09-2007, 06:34 PM

Erm, nope

body {
background-image: url(images/stripes.png);
font: 10px verdana;
color: #2e2e2e;
height: 100%;
margin: 0 0 0 0px;
}

#box {
margin-top: 0px;
margin-bottom: 0px;
width: 600px;
background-color: #fff;
min-height: 100%;
margin-right: auto;
margin-left: auto;
}

that's my whole code, thanks for the help.

Aflux · 05-09-2007, 06:39 PM

Show me the whole site.

wewt · 05-09-2007, 06:41 PM

body {
background-image: url(images/stripes.png);
font: 10px verdana;
color: #2e2e2e;
height: 100%;
margin: 0 0 0 0px;
}

#box {
margin-top: 0px;
margin-bottom: 0px;
width: 600px;
background-color: #fff;
min-height: 100%;
margin-right: auto;
margin-left: auto;
}

www.wewt.co.uk/xy/

<!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>
<title>W!</title>
<meta name="description" content="WEWT graphic design services" />
<meta name="keywords" content="graphic, design, web, wewt, layout, logo" />
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<link rel="Shortcut Icon" href="/favicon.ico" />
<link href="http://www.wewt.co.uk/xy/style.css" rel="stylesheet" type="text/css" />
</head>
<?php

$getpage = $_GET['page'];
$page = $getpage. '.htm';

if (file_exists($page))
{
echo("<body onload=\"" .$getpage. ".src='http://www.wewt.co.uk/xy/images/" .$getpage. "_on.PNG';\">");
}
else
{
echo "<body>";
}

?>
<div id="box">
<?php

$getpage = $_GET['page'];
$page = $getpage. '.htm';

if (file_exists($page))
{
include($page);
echo('<script type="text/javascript">' .$getpage. '.src="http://www.wewt.co.uk/xy/images/' .$getpage. '_on.PNG";</script>');
}
else if ($getpage == null)
{
include('blog.htm');
}
else
{
include('error.htm');
}

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

Aflux · 05-09-2007, 06:43 PM

I dinny see nay box on the site.

Code:

body {
background-image: url(images/stripes.png);
background-repeat: repeat;
font-size: 10px;
font-family: verdana;
color: #2e2e2e;
margin: 0 0 0 0px;
}

#box {
width: 600px;
background-color: #ffffff;
}

Anyway, change your CSS code to that and then change it to

<div id="box" align="center">

wewt · 05-09-2007, 06:52 PM

doesn't work. look

www.wewt.co.uk/xy

Aflux · 05-09-2007, 07:00 PM

The box is at the top of the screen?

wewt · 05-09-2007, 07:06 PM

yeah but not the bottom. I need it to reach both. thanks loads for the help btw.

Aflux · 05-09-2007, 07:08 PM

As far as I know, that's impossible until the content fills enough to reach the bottom.

I'm 80% sure on that.

Thread: CSS problem

Thread Tools

CSS problem

Posting Permissions