...

View Full Version : Table Issues



rooban
07-25-2011, 11:33 AM
Dear all experts,

Please get me the solution for this simple question.

I'm trying to do a layout using table. (I can solve this issue with div but i need the correct solution for this to get me a good understanding in HTML)

Q : Please solve my inner table height in IE8. the code i attached is working fine in IE6 and 7.

Please use the same code from below because its very simple code. Please dont provide solution with javascript. i have worked with those and get the job done. But i need the proper answer for this.

========================================================

<!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=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
body {
color:#000;
background-color: #fff;
}
html, body {
height:100%;
margin: 0;
padding: 0;
border: none;
text-align: center;
}
.wrapper {
height:100%;
background-color: Gray;
margin: 0 auto;
text-align: left;
vertical-align: middle;
width: 400px;
}
.wrapper .header {
height:60px;
background-color:Green;
}
.wrapper .content {

background-color:Yellow;
*height:85%;
*background-color:Orange;
_background-color:Blue;
}
.wrapper .footer {
height:10px;
background-color:Red;
}

.Contentwrapper { height:100%; background-color:#C6C; }


</style>
</head>

<body>
<table class="wrapper">
<tr>
<td class="header" valign="top">Header</td>
</tr>
<tr>
<td class="content" valign="top">
<table class="Contentwrapper">
<tr>
<td class="ContentBody">
Content Area
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td class="footer" valign="top">Footer</td>
</tr>
</table>
</body>
</html>
==========================================


Best Regards,
Rooban

teedoff
07-25-2011, 02:40 PM
(I can solve this issue with div but i need the correct solution for this to get me a good understanding in HTML)


Then the correct solution for this WOULD be to use divs. Tables have been deprecated and discouraged for years with regards to page layouts. Read more here (http://www.hotdesign.com/seybold/) about why tables for layouts are bad.



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum