Ustaw bezwzględną pozycję div rozszerzając nadrzędną wysokość div

Jak widać w poniższym CSS, chcę, aby child2 ustawił się przed dzieckiem1. Dzieje się tak, ponieważ strona, którą aktualnie tworzę, powinna działać również na urządzeniach mobilnych, na których dziecko2 powinno znajdować się na dole, ponieważ zawiera nawigację, którą chcę poniżej treści na urządzeniach mobilnych. - Dlaczego nie 2 strony główne? To jedyne 2 div, które są ponownie rozmieszczane w całym HTML, więc 2 masterpages dla tej drobnej zmiany to przesada.

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 ma dynamiczną wysokość, ponieważ różne podwitryny mogą mieć więcej lub mniej elementów nawigacyjnych.

Wiem, że elementy pozycjonowane bezwzględnie są usuwane z przepływu, a więc ignorowane przez inne elementy.
Próbowałem ustawieniaoverflow:hidden; na rodzicu div, ale to nie pomogło, ani clearfix.

Moja ostatnia ucieczka będzie javascript, aby odpowiednio zmienić położenie dwóch div, ale na razie spróbuję sprawdzić, czy istnieje sposób nie javascript.

questionAnswers(14)

yourAnswerToTheQuestion