Hacer posicionamiento absoluto div expandir padre div altura

Como puede ver en el CSS a continuación, quiero que child2 se posicione antes que child1. Esto se debe a que el sitio que estoy desarrollando actualmente también debería funcionar en dispositivos móviles, en el que child2 debería estar en la parte inferior, ya que contiene la navegación que deseo debajo del contenido de los dispositivos móviles. - ¿Por qué no 2 masterpages? Estos son los únicos 2 divs que están reposicionados en todo el HTML, por lo que 2 páginas maestras para este cambio menor es una exageración.

HTML:

<div id="parent">
    <div class="child1"></div>
    <div class="child2"></div>
</div>

CSS:

parent { position: relative; width: 100%; }
child1 { width: auto; margin-left: 160px; }
child2 { width: 145px; position: absolute; top: 0px; bottom: 0px; }

child2 tiene una altura dinámica, ya que diferentes subsitios podrían tener más o menos elementos de navegación.

Sé que los elementos posicionados absolutos se eliminan del flujo, por lo que otros elementos los ignoran.
Intenté estableceroverflow:hidden; en el div padre, pero eso no ayudó, tampoco lo hace el clearfix.

Mi último recurso será javascript para reposicionar los dos divs en consecuencia, pero por ahora intentaré y veré si existe una forma no javascript de hacerlo.

Respuestas a la pregunta(14)

Su respuesta a la pregunta