Как я могу заставить DIV вести себя как IMG для использования в качестве спрайта CSS?

Я написал код, который автоматически создает спрайты CSS на основе тегов IMG на странице и заменяет их на DIV с (как я думал) подходящим CSS для размещения изображения спрайта в качестве фона, позволяющего просвечивать соответствующую часть - проблема в что я не могу заставить DIV вести себя как замена для IMG.

Если я оставлю значение 'display' по умолчанию, установленное на 'block', тогда, если исходный IMG был расположен в конце некоторого текста, заменяющий DIV перейдет к следующей строке после текста (что, конечно, я ожидал чего-то с отображением: блок делать).

Если я изменю «отображение» на встроенный, то DIV останется в той же строке, что и текст, но игнорирует «ширину» и «высоту», которые я установил, и сворачивается. Я попытался разместить   внутри DIV, но тогда он занимает достаточно ширины, чтобы содержать nbsp.

Я пробовал поэкспериментировать с настройкой отображения всех возможных значений (в том числе «непонятных», таких как «table-row», «run-in», «compact» и т. д.), Но все безуспешно. Можно ли вообще создать DIV с тем же поведением макета, что и IMG?

Я открыт для чего-то более сложного, чем просто один DIV, однако я пробовал там очевидные вещи (один DIV внутри другого, где внутренний DIV настроен на display: block с внешним набором для display: inline), но у меня нет Я тоже не нашел там комбинации, которая работает.

Всегда есть определенные вещи, которые я могу сделать помимо замененного IMG / DIV, чтобы получить желаемый макет, но моя цель - иметь общий механизм авто-CSS-спрайтов, который работает независимо от остальной части HTML.