Hey Guys, I've been searching a lot! and months for a solution for that specific problem !! please help . if anyone can figure it out! :S:S
i have that code:
<!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=utf-8" />
<title>Digital Surveillance system</title>
<link rel="stylesheet" type="text/css" href="style.css" />
<script type="text/javascript" src="include/jquery.js"></script>
<script type="text/javascript" src="include/script.js"></script>
<script type="text/javascript" src="include/jquery.jqDock.min.js"></script>
<script type="text/javascript" src="./bgstretcher.js"></script>
<link rel="stylesheet" href="./bgstretcher.css" />
</head>
<body>
<?php /*
<div id="webContainer">
<div id="header">this is the header</div>
<div id="middleContainer">
<div id="leftContainer">Left Container</div>
<div id="rightContainer">Right Container</div>
</div>
<div id="footer"> Footer</div>
</div>*/ ?>
<table width="100%" height="100%" border="1">
<tr>
<td height="100" colspan="2" align="center" valign="top" bgcolor="#9900CC" >Header</td>
</tr>
<tr>
<td width="150" align="right" valign="middle" bgcolor="#FF0000">Menu</td>
<td align="center" valign="middle" bgcolor="#0000FF">Content placed in the middle</td>
</tr>
<tr>
<td height="100" colspan="2" align="center" valign="bottom" bgcolor="#99FFFF">Footer</td>
</tr>
</table>
</body>
</html>
now if you open Firefox or Google chrome to see the code, it works perfectly! this is the layout that i want! (PS: its not working on IE as usual)
But here is the thing im trying to convert it into <div> (im shifting from table design to divs) and i cant manage to fix it :S
please if anyone have a solution for it.
I want the solution to be pure css, no position:absolute neither JavaScript.
any help is highly appreciated! thank you :S (PS: im depressed)