Доброй ночи, винградовцы!

Есть такая задача:
Картинка в зав-ти от разрешения браузера должна сужаться или наоборот расширяться. Т.е. если разрешение 1024x768, то ее область видимости должна уменьшиться, если разрешение 1280х800, то соответственно должна показаться больше или на максимум.

Решение:
Сделать динамичный див, у которого фоном будет именна эта картинка. Он уменьшается при маленьком разрешении, и ограничивает видимость картинки с background-position: center;

Т.е. например с таблицей:


Вопрос:
Решение вроде бы как подходит.
Может есть какое-нибудь другое, более идеальное?
Как вообще это делать правильно?

Буду рад любым советам.
Спасибо!

Пример:

эммм, вообще-то у вас решение и написано


хотя надо чуток поправить



привязываешь это к боди и всего делов - бэкграунд по центру и ведёт себя как надо

Ну это понятно  Я же сразу написал, что использовал такое решение. Спасибо.

Неужели нет ничего другого?..

Добавлено через 12 минут и 29 секунд
И причем здесь боди? У меня может быть таких 20 картинок на странице.

emptyby, а как ваш div будет растягиваться по высоте ?
Ну и если вот такой вот пример взять:

где pixel.gif -- прозрачная в один пиксель картинка
ну и width и height прописать как вам нужно. А также всё уже взять в див, которому прописать то что нужно.
Если я всё правильно здесь сделал, то плюсы следующее:
1. Всё таки это картинка, а не слой, поэтому мы здесь и имеем картинку, т.е. семантически вернее.
2. Можно прописать alt.