UPDATE: Turns out that Bart's answer is the correct one. 4*64+8*1 = 264px wide div to contain the other divs and their 1px borders gives exactly the effect I wanted. I modified my sample code to contain his answer. Thanks Bart.
I'm struggling, again, with CSS. This sample shows 1,2,3,4 at the size I want them using a table. When I try to do the same with CSS the div collapses to the size of the content rather than then height/width specified. Target browser: IE8
<!doctype html>
<html>
<head>
<style type="text/css" media="screen">
#one, #two, #three, #four, #five, #six, #seven, #eight
{
height: 64px; width: 64px;
border: 1px solid black;
background-color: lightgreen;
}
#five, #six, #seven, #eight { float:left; }
#cont {width:264px;}
</style>
</head>
<body>
<center>
<table><tr>
<td><div id="one">1</div></td>
<td><div id="two">2</div></td>
<td><div id="three">3</div></td>
<td><div id="four">4</div></td>
</tr></table>
<div id="cont">
<div id="five">5</div>
<div id="six">6</div>
<div id="seven">7</div>
<div id="eight">8</div>
</div>
</center>
</body>
</html>