Ширина подписи к изображению такая же, как у изображения

Как сделать ширину подписи к изображению такой же, как у изображения? Теперь у меня есть следующий код:

<div class="image">
    <img src="foo.jpg" alt="" />
    <div>This is the caption.</div>
</div>

Я пробовал много чего (плавающее, абсолютное позиционирование и т. Д.), Но если заголовок длинный, он всегда делает div широким, а не занимает много строк. Проблема в том, что я не знаю ширины изображения (или длины подписи). Единственный способ решить эту проблему - использовать таблицы?