Overflow: auto не работает с преобразованными дочерними элементами CSS3. Предлагаемое решение?

Проблема: css3-преобразования, применяемые к дочернему элементу внутри div, игнорируются браузером (FF5, Chrome12, IE9) при вычислении scrollHeight и scrollWidth содержащихся прокруточных панелей div при использовании "overflow: auto;".

<style type="text/css">
div{ width: 300px;height:500px;overflow:auto; }
div img {
-moz-transform: scale(2) rotate(90deg);
-webkit-transform: scale(2) rotate(90deg);
-ms-transform: scale(2) rotate(90deg);
}
</style>    
<div><img src="somelargeimage.png" /></div>

Я собрал небольшой тест на jsfiddle, показывающий нежелательное поведение.

http://jsfiddle.net/4b9BJ/

По сути, я пытаюсь создать простой веб-просмотрщик изображений с использованием css3-преобразований для вращения и масштабирования и хотел бы, чтобы содержащий div с фиксированной шириной/высотой мог прокручивать, чтобы увидеть полный контент содержащегося изображения.

Есть ли разумный способ справиться с этой проблемой или даже грубым способом? Любая помощь приветствуется.

Ответ 1