I do my coding using DIVs and CSS:
My CSS Code:
/* CSS Document */
body {
background-color: #99CCFF;
}
#container {
background-repeat: no-repeat;
width: 1024px;
height: 768px;
left: 0px;
top: 0px;
padding: 0px;
margin-top: 0px;
margin-right: 10px;
margin-bottom: 10px;
margin-left: 0px;
position: absolute;
}
#Banner {
background-image: url(images/banner.gif);
background-repeat: no-repeat;
width: 1024px;
height: 192px;
}
#Navigation {
background-image: url(images/naviga.gif);
background-repeat: no-repeat;
width: 219px;
height: 407px;
}
#SiteStats {
background-image: url(images/sitestats.gif);
background-repeat: no-repeat;
width: 219px;
height: 169px;
}
#Content {
background-image: url(images/content.gif);
background-repeat: no-repeat;
width: 773px;
height: 567px;
position: absolute;
left: 219px;
top: 192px;
}
#Side {
background-image: url(images/sides.gif);
background-repeat: no-repeat;
width: 32px;
height: 576px;
position: absolute;
left: 992px;
top: 192px;
}
#Bottom {
background-image: url(images/bottom.gif);
background-repeat: no-repeat;
width: 773px;
height: 9px;
position: absolute;
left: 219px;
top: 759px;
}
#Copyright {
position: absolute;
left: 183px;
top: 585px;
width: 359px;
}
#Content_actuall {
height: 403px;
width: 731px;
position: absolute;
top: 13px;
left: 11px;
}
My HTML:
<!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>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>
<link rel="stylesheet" href="css/css.css" media="screen" />
<style type="text/css">
<!--
#Layer1 {
position:absolute;
width:162px;
height:47px;
z-index:1;
left: 93px;
top: 500px;
}
#Layer2 {
position:absolute;
width:477px;
height:16px;
z-index:2;
left: 266px;
top: 531px;
}
-->
</style>
</head>
<body>
<div id="container">
<div id="Banner"></div>
<div id="Navigation"></div>
<div id="SiteStats"></div>
<div id="Content">
<div id="Layer1">
<div align="center">
<p>
<!-- Start Media Player -->
<object id="MediaPlayer" type="application/x-oleobject" height="45" standby="Please wait while we start the radio!" width="163" classid="CLSID:6BF52A52-394A-11D3-B153-00C04F79FAA6">
<param value="http://IPADDRESS:PORT HERE WHEN SERVER IS READY" name="URL">
<param value="1" name="rate">
<param value="0" name="balance">
<param value="0" name="currentPosition">
<param value="" name="defaultFrame">
<param value="1" name="playCount">
<param value="-1" name="autoStart">
<param value="0" name="currentMarker">
<param value="-1" name="invokeURLs">
<param value="" name="baseURL">
<param value="100" name="volume">
<param value="0" name="mute">
<param value="mini" name="uiMode">
<param value="0" name="stretchToFit">
<param value="0" name="windowlessVideo">
<param value="-1" name="enabled">
<param value="-1" name="enableContextMenu">
<param value="0" name="fullScreen">
<param value="" name="SAMIStyle">
<param value="" name="SAMILang">
<param value="" name="SAMIFilename">
<param value="" name="captioningID">
<param value="0" name="enableErrorDialogs">
<param value="3995" name="_cx">
<param value="1164" name="_cy">
</object></p>
</div>
</div>
<div id="Copyright">© Copyright 2005 Hab-Touch. Produced By :.:Numark:.: </div>
<div id="Content_actuall">ACTUAL CONTENT GOES IN HERE </div>
</div>
<div id="Side"></div>
<div id="Bottom"></div>
</div>
</body>
</html>
I think I am doing it properley but if im not, I dont care I like doing it this way :D