Restrict element to dimensions of page

Is there some method to simply tell an element to not overflow the dimensions of the page and instead to just resize itself to stay within the pages dimensions?

So, I have an element with a necessary position: absolute and its parent with a necessary position:relative;. I cant seem to position it relative to the page, because it will obviously always only position itself relative to its parent.

https://svelte.dev/repl/cad337d2bc4e4f0cb51b1b24aafc09f1?version=4.2.12

See in the screenshot how it just overflows the width of the page. Is it possible to just let it collapse?
image.png
Cybernetically enhanced web apps
text overflow • REPL • Svelte
Was this page helpful?