Jon Haupt solved the CSS problem I hadpreviously posted, of making a box that is just large enough to fit the things inside it, rather than expanding to the size of the surrounding box.

It turns out that using "float: left" or "float: right" has this effect.

Here is an example of the solution, where the middle box has a tight-fitting background:

and the HTML:

<div style="width: 100%;">
<div style="width: 20%; float: left;">foo foo foo</div>
<div style="width: 20%; float: left;"><div style="background-color:#f00; float: left; padding: 0px; margin: 0px;"><p style="margin:
0px;">zap<br/>zoom</p></div></div>
<div style="width: 20%; float: left;">bar bar</div>
</div>
<div style="clear: both;"></div>