@atotic Could you clarify example 1? I don’t understand the <div id="content"> inside the iframe. Iframes load documents via the src attribute, and their contents are empty. From my understanding, placing text or elements inside an iframe serves as a fallback for browsers that don’t support iframes.
You are right, that example is invalid use of HTML. Just imagine that the <iframe> had a src attribute whose body was the content div. I’ll fix it. Ideally, I’d love to have a cleaner use case instead.
Most use-cases for ResizeObserver are to create/remove DOM based on you current size. A lot the use-cases for “element queries” are satisfied by this. For example when a menu-bar in an app is too small, display a drop-down-menu with the items instead.
The css-layout-api is explicitly trying to write css layouts in author code performantly, at this stage of the pipeline you don’t have elements to refer to and manipulate.