There is no real solution for HTML unless you redesign the entire resize functionality using Javascript and fixed sizes. You know where this problem has been very elegantly solved? Windows Presentation Foundation. There is a two pass resize mechanism: first the children request the size they want, bubbling up, then a second pass comes top-down where containers tell children what their size is. In the end, the child cannot force a container size. Also, the logic of how children are arranged is defined in the container, so a stackpanel would be working differently than a grid or a listview.
While it wouldn’t work in the same way in a web medium, I think it is worth considering that a one pass mechanism is not sufficient and rather than adding weird conditions in CSS, we should maybe think of revamping the rendering mechanism and adding new events.
There is no real solution for HTML unless you redesign the entire resize functionality using Javascript and fixed sizes. You know where this problem has been very elegantly solved? Windows Presentation Foundation. There is a two pass resize mechanism: first the children request the size they want, bubbling up, then a second pass comes top-down where containers tell children what their size is. In the end, the child cannot force a container size. Also, the logic of how children are arranged is defined in the container, so a stackpanel would be working differently than a grid or a listview.
While it wouldn’t work in the same way in a web medium, I think it is worth considering that a one pass mechanism is not sufficient and rather than adding weird conditions in CSS, we should maybe think of revamping the rendering mechanism and adding new events.