I've tried several of the suggestions for getting a grid to display in a table cell without success.
Any ideas why the page below doesn't work?
<html>
<head>
<title>Grid in table</title>
<style> body, html {margin:0px; padding: 0px; overflow: hidden;} </style>
<!-- ActiveWidgets stylesheet and scripts -->
<link href="themes/default/styles/grid.css" rel="stylesheet" type="text/css" ></link>
<script src="scripts/grid.js"></script>
<!-- grid format -->
<style>
.active-controls-grid {height: 100%; font: menu;}
.active-column-0 {width: 80px;}
.active-column-1 {width: 100px;}
.active-column-2 {width: 200px;}
.active-column-3 {width: 80px;}
.active-column-4 {width: 80px;}
.active-column-5 {width: 80px;}
.active-column-6 {width: 40px;}
.active-column-7 {width: 40px;}
.active-column-8 {width: 40px;}
.active-column-9 {width: 40px;}
.active-grid-column {border-right: 1px solid threedlightshadow;}
.active-grid-row {border-bottom: 1px solid threedlightshadow;}
</style>
<!-- grid data -->
<script>
var myData = [
["1284930-12","ssddsd", "foo", "Alert", "2004Dec07", "Unknown", "x", "x", "x", "x"],
["1284930-12","vffcds", "foo", "Alert", "2004Dec07", "Unknown", "x", "x", "x", "x"]
];
var myColumns = [
"Account", "ID", "Class", "Status", "Date", "Type", "SSN","Add.", "Home","Work"
];
</script>
<script>
</head>
<TABLE STYLE="table-layout:fixed" WIDTH="600">
<tr>
<td>
<div id="grid">
<script>
// create ActiveWidgets Grid javascript object
var obj = new Active.Controls.Grid;
// set number of rows/columns
obj.setRowProperty("count", 2);
obj.setColumnProperty("count", 10);
// provide cells and headers text
obj.setDataProperty("text", function(i, j){return myData[i][j]});
obj.setColumnProperty("text", function(i){return myColumns[i]});
// set headers width/height
obj.setRowHeaderWidth("28px");
obj.setColumnHeaderHeight("20px");
// set click action handler
obj.setAction("click", function(src){window.status = src.getItemProperty("text")});
obj.setRowHeaderWidth("0px");
// write grid html to the page
document.write(obj);
</script>
</div>
</td>
</tr>
</table>
</body>
</html>
First, take out the extra opening <script> tag before the closing </head> tag, then change the height of "100%" defined in the .active-controls.grid style to something specific like "200px".
Then it works fine. Rather than setting it to 100% to get it to fill the window since that doesn't appear to work, maybe try using javascript to get the window height and set the style to that pixel height after the page has loaded.
HTH - Jeff
Update... actually what you have will work if you remove the STYLE="table-layout:fixed" from your TABLE tag and add HEIGHT="100%".