Пржде чем позволять себе такие вещи, подучите блочную модель. В Вашем случае я бы посоветовал, чтобы задник был задником.
Лучшее, что могу предложить:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
<title></title>
<style type="text/css">
.tpl-composite-group-image {
position: absolute;
}
.tpl-composite-group-text {
position: relative;
}
</style>
</head>
<body>
<table>
<tr>
<td>
<div>
<img src="http://javascript.ru/forum/images/ca_serenity/misc/logo.gif" class="tpl-composite-group-image" alt="" />
<div class="tpl-composite-group-text">
<h2>Lorem Ipsum Dolor Sit Amet</h2>
</div>
</div>
</td>
</tr>
</table>
</body>
</html>
Логика примерно такая:
Заполнение документа производится слева-направо, сверху-вниз.
В TD находится IMG с position:absolute. Этот элемент рендерится в новом слое, левый верхний угол его находится в текущей позиции «курсора рендеринга» — слева-сверху элемента.
После него рендерится DIV c position: relative. Он также рендерится в новом слое, перекрывая IMG, но его bounding box не равен нулю, и он распирает TD на нужную высоту. «курсор рендеринга» не сдвинулся, так что он тоже будет расположен сверху-слева.