• Locked
1 reply [Last post]
Thu, 2010-03-25 03:09
blimp
Offline
Enthusiast
Last seen: 10 years 33 weeks ago
Timezone: GMT+10
Joined: 2009-06-18
Posts: 91
Points: 36

How do I make the

position below the header and footer div's? 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
* {
	padding: 0;
	margin: 0;
	background-color: #f8f8f8;
}
#outer {
	position: absolute;
	top: 50%;
	left: 0px;
	width: 100%;
	height: 1px;
	overflow: visible;
}
#inner {
	width: 1000px;
	height: 450px;
	margin-left: -500px;
	position: absolute;
	top: -225px;
	left: 50%;
	background-image: url(inner_image.jpg);
}
#header {
	background-color: #1c1c1c;
	height: 119px;
	width: 100%;
}
#footer {
	height: 119px;
	width: 100%;
	background-color: #1c1c1c;
	position: absolute;
	bottom: 0px;
}
#playtime_header_logo {
	background-image: url(playtime_films_headeer_logo.jpg);
	height: 47px;
	width: 235px;
	margin: auto;
	top: 60px;
	position: relative;
}
</style>
</head>
<body>
<div id="header">
  <div id="playtime_header_logo"></div></div>
	<div id="outer">
      <div id="inner">
 
      </div>
    </div>
<div id="footer"></div>
 
</body>
</html>

Top
Tags:
Thu, 2010-03-25 03:12
#1
blimp
Offline
Enthusiast
Last seen: 10 years 33 weeks ago
Timezone: GMT+10
Joined: 2009-06-18
Posts: 91
Points: 36

That's cool I just worked it

That's cool I just worked it out Wink 

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
* {
	padding: 0;
	margin: 0;
	background-color: #f8f8f8;
}
#outer {
	position: absolute;
	top: 50%;
	left: 0px;
	width: 100%;
	height: 1px;
	overflow: visible;
}
#inner {
	width: 1000px;
	height: 450px;
	margin-left: -500px;
	position: absolute;
	top: -225px;
	left: 50%;
	background-image: url(inner_image.jpg);
}
#header {
	background-color: #1c1c1c;
	height: 119px;
	width: 100%;
	position: absolute;
	top: 0px;
	z-index: 10;
}
#footer {
	height: 119px;
	width: 100%;
	background-color: #1c1c1c;
	position: absolute;
	bottom: 0px;
	z-index: 10;
}
#playtime_header_logo {
	background-image: url(playtime_films_headeer_logo.jpg);
	height: 47px;
	width: 235px;
	margin: auto;
	top: 60px;
	position: relative;
}
</style>
</head>
<body>
<div id="header">
  <div id="playtime_header_logo"></div></div>
	<div id="outer">
      <div id="inner">
 
      </div>
    </div>
<div id="footer"></div>
 
</body>
</html>

Top
  • Locked