CCS для размещения элемента HTML у левого края окна без «абсолюта» или JS? ⇐ CSS

[Anonymous]

На статическом веб-сайте (можно, но не желательно использовать JS) у меня есть блог с шириной столбца (на большом экране) около 50 % для удобства чтения.
Но у меня есть большое изображение (на самом деле это интерактивный объект) с большим количеством деталей, которое было бы здорово занимать (почти) всю ширину экрана.

Код: Выделить всё

width: 100vw;

(или w-screen в Tailwind) — это здорово, но левый край изображения находится на одной линии с родительским. Указав относительное позиционирование, я могу сдвинуть изображение влево, используя Left = -X px, но расстояние X меняется, поэтому без JavaScript это не сработает.
Использование Tailwind или ванильный CSS, я также пробовал Transform: TranslateY(-25%);, но мне все равно нужно вычислить расстояние.
Абсолютное позиционирование — это здорово, но остальная часть блога не обтекает изображение.
Фиксированное позиционирование также не работает, поскольку изображение должно прокручиваться вместе с остальным текстом.
Итак, думаю, у меня остался Javascript:

Код: Выделить всё

document.getElementById("myElementId").style.Left =
-document.getElementById("myElementId").getBoundingClientRect().left;

Есть еще идеи? (Я бы подумал, что моя проблема не такая уж необычная, но не видел никаких чистых решений.)

Подробнее здесь: https://stackoverflow.com/questions/790 ... bsolute-or