You answered the question by yourself: “I know that absolute positioned elements are removed from the flow, thus ignored by other elements.” So you can’t set the parents height according to an absolutely positioned element.
You either use fixed heights or you need to involve JS.
Update 2022: Nowadays one might use CSS flexbox
[1] or grid
[2] to reverse the visual order of HTML elements inside a parent container without using position: absolute;
.
- https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Flexible_Box_Layout/Aligning_Items_in_a_Flex_Container#alignment_and_flex-direction
- https://developer.mozilla.org/en-US/docs/Web/CSS/grid or
Reverse order of columns in CSS Grid Layout