Получить размер макета дочерних компонентов в Svelte ⇐ CSS

[Гость]

Я конвертирую веб-сайт VanillaJS в Svelte, где элементы div должны располагаться на веб-странице случайным образом. Обратите внимание, что размер каждого элемента div может варьироваться в зависимости от его содержимого. Они не могут иметь фиксированный размер в CSS.

Я могу легко вычислить случайное верхнее и левое положение для каждого элемента div с максимальным размером окна и отправить его в качестве реквизита каждому элементу div, используя его во встроенном стиле. Но я не знаю, как вычесть рассчитанный размер каждого элемента div, чтобы в верхнем левом положении элемент div иногда не выходил частично за пределы экрана Windows.

В Vanilla JS я использовал offsetWidth и offsetHeight, чтобы получить расчетный размер элементов div, поскольку существовали типы HTMLElement, но это не помогло в Svelte не работает: получаю сообщение об ошибке Свойство OffsetHeight не существует для типа Element.

Есть идеи, как этого добиться?

Вот код основного App.svelte:

импортировать окно из "./comComponents/Div.svelte"; const left = Math.random() * window.innerWidth; // TODO вычитает ширину div const top = Math.random() * window.innerHeight; // TODO вычитает высоту div // ЭТО НЕ РАБОТАЕТ // const el = document.querySelector('#my-div') // const left = Math.round(Math.random() * (window.innerWidth - el.offsetWidth)) // const top = Math.round(Math.random() * (window.innerHeight - el.offsetHeight)) ...и это в подкомпоненте div Div.svelte:
экспортировать let divName; экспорт пусть сверху; экспорт пусть остался; экспортировать пусть htmlContent; {divName {@html htmlContent .div { минимальная ширина: 250 пикселей; максимальная ширина: 600 пикселей; позиция: абсолютная; цвет фона: красный; }