PDA

View Full Version : 100% Width and Height with Border and center of the screen opinion



cb2004
Oct 14th, 2008, 05:20 PM
What do you guys think of the way I have done this?


<!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>
html {
height: 100%;
}

body {
color: #FFFFFF;
background: #999999;
font-family: arial;
font-size: 80%;
height: 100%;
margin: 0;
}

#h {
width: 100%;
height: 1px;
position: absolute;
overflow: visible;
top: 50%;
}

#c {
background: #FFFFFF;
width: 700px;
height: 320px;
margin: 0 0 0 -350px;
position: absolute;
top: -160px;
left: 50%;
}

#top {
background: #FFFFFF;
position: fixed;
top: 0;
width: 100%;
height: 20px;
}

#right {
background: #FFFFFF;
position: fixed;
right: 0;
width: 20px;
height: 100%;
}

#bottom {
background: #FFFFFF;
position: fixed;
bottom: 0;
width: 100%;
height: 20px;
}

#left {
background: #FFFFFF;
position: fixed;
left: 0;
width: 20px;
height: 100%;
}
</style>
</head>
<body>
<div id="h">
<div id="c"></div>
</div>
<div id="top"></div>
<div id="right"></div>
<div id="bottom"></div>
<div id="left"></div>
</body>
</html>

Is there a better way

abduraooft
Oct 14th, 2008, 05:49 PM
It's not the same in IE6 as that of FF2.
Are you trying for something like Dead Centre (http://www.wpdfd.com/editorial/thebox/deadcentre4.html)

cb2004
Oct 14th, 2008, 05:53 PM
How does it look on IE6 as I have Vista. Could you be so kind and post a screenshot?

Yes I am trying to get stuff smack bang in the middle with a border around the whole browser window.

Cheers.

abduraooft
Oct 14th, 2008, 06:08 PM
You could try it in http://browsershots.org/ or http://tredosoft.com/Multiple_IE