UPDATED: I have included a demo image showing the desired layout design for the site.
The 3 column layout table I am trying to achieve in the demo is not functioning as expected. I have provided an image of the desired outcome and a demo link with my current result. Below is the code along with the accompanying CSS:
<!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>title</title>
</head>
<body>
<div style="display:table;width:100%;height:100%:min-width:1000px;">
<div style="display:table-row">
<div style="display:table-cell;width:100%;min-width:1000px;height:23px;min-height:23px;"> only 1 TD 100% width only 23 height </div>
</div>
<div style="display:table-row">
<div style="display:table-cell;width:200px;min-width:200px;height:77px;min-height:77px;"> left 200 px width </div>
<div style="display:table-cell;width:100%;min-width:800px;height:77px;min-height:77px;"> middle 100% of screen width </div>
<div style="display:table-cell;width:200px;min-width:200px;height:77px;min-height:77px;"> right 200 px width</div>
</div>
<div style="display:table-row">
<div style="display:table-cell;width:200px;min-width:200px;height:100%;min-height:100%;"> left 200 px width but height 100% </div>
<div style="display:table-cell;width:100%;min-width:800px;height:100%;min-height:100%;"> middle 100% of screen width but height 100% </div>
<div style="display:table-cell;width:200px;min-width:200px;height:100%;min-height:100%;"> right 200 px width but height 100% </div>
</div>
<div style="display:table-row">
<div style="display:table-cell;width:100%;min-width:1000px;height:12px;min-height:12px;"> only 1 TD 100% width only 12px height </div>
</div>
</div>
</body>
</html>
Shown below is the image representing the desired layout:
For a live demonstration, you can view the Fiddle here: https://jsfiddle.net/yzr3v04u/
If CSS tables are meant to be versatile and easy to manipulate, why am I facing challenges getting the output I require? Are there alternative methods to achieve the layout displayed in the image demo?