1 reply [Last post]
flashgroover
Offline
newbie
potland Or
Last seen: 16 years 41 weeks ago
potland Or
Joined: 2004-04-11
Posts: 2
Points: 0

Im trying to position a div on the screen but instead of positioning from 0,0, i want to position from the center of my screen. somethig like 50%,50%. i want to do an absolute position from the center of screen horz, and i cant figure it out.

i hope i explained it okay. thanks

ClevaTreva
ClevaTreva's picture
Offline
Guru
A hilly place, UK
Last seen: 2 years 11 weeks ago
A hilly place, UK
Joined: 2004-02-05
Posts: 2902
Points: 0

positioning div by screen center

Hi

This is a simple demo, but re-size the page too narrow and it falls off the page to the left, same if too short, it goes off the top.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" 
   "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>New document</title>
<link rel="Stylesheet" href="" type="text/css" media="All" />
<style type="text/css">
html,body{
margin:0;
padding:0;
border:0;
background:#EEEEEE;
}
#pagecontainer{
position:absolute;
min-width:500px;
background:#BBBBBB;
min-height:300px;
left:50%;
top:50%;
margin-left:-250px;
margin-top:-150px;
}
* html #pagecontainer{
width:500px;
height:300px;
}

</style>
</head>
<body>
<div id="pagecontainer"><p>content here</p></div>
</body>
</html>

Trevor