Div parent div not containing children div

Question

I have something like this:

<div id="page">
  <---some content here -->
  <div id="container">
    <div id="child">
    </div>
  </div>
</div>

now, #page does not have any formatting in it. It works correctly for some content, i mean, when content is bigger, the #page has more height also. But, when today i applied #container in it, which is positioned absolute, and within it there is a #child which is positioned relative, it seems like #container is not within #page - that means if #container grows, height of #page is not changing, why?

Answer 1

Absolutely positioned elements are removed from the normal flow of the document causing them not to increase the height of their parent if their height increases.

Elements that are positioned relatively are still considered to be in the normal flow of elements in the document. In contrast, an element that is positioned absolutely is taken out of the flow and thus takes up no space when placing other elements. Full Text

Answer 2

Kevin's answer revealed the trick of (why is not possible the) autosizing.

For positioninig instead, note that if #container is absolute, and you want it to refer to #page, then #page should be relative, absolute or fixed , not static (the default).

Otherwise, the positioning would be referred to the HTML element / viewport, the visible area of the window.