Wie position:absolute außerhalb eines Elements "mitnehmen"?

[Foxtrott_01]

Hallo ich bins nochmal,

Ich habe mich mit position:absolute ziemlich in eine "Sackgasse" manöviert...

...und zwar habe ich eine [klassische] Toggle-Menüstruktur - ursprünglich war das ein DIV, welches ein Menü nach unten öffnet bzw. nach oben schließt, nach einem Hinweis von Gunnar ist das nun semantisch korrekt ein Button. Danke hier nochmal an Gunnar für den Hinweis!

Die Struktur der Seite ist wenig aufregend [hier ein wenig verkürzt dargestellt]:

<nav>
	<button>Menü</button>
	<ul id="toggle">
		<li>Menüpunkt</li>
		<li>...</li>
	</ul> <!-- <ul>: position:absolute -->
</nav>
<section>...</section>

...nun nimmt position:absolute die <ul>Menüstruktur aus dem Fluss für alle Elemente innerhalb von <nav>, nicht aber für das nachfolgende <section> Element, hier wird die gesamte Höhe voll berechnet.

<section> sollte sich vertikal ja direkt unter <button> einreihen - tatsächlich aber entsteht eine vertikale Lücke von der Höhe des <ul> Elements.

Natürlich könnte ich alle folgenden Elemente nun ebenso absolut positionieren oder einen Javascript-Hack installieren - aber gibt's dafür irgendwelche Best-Practices?

Danke, F.

[Foxtrott_01]

Nachtrag:

Nachdem ich die Welt nicht mehr verstanden und meinen Code in Folge komplett seziert habe:

Tatsächlich habe ich einfach ein vertikal ausgerichtetes flex: 1 0 auto des nav Elements übersehen! Danke an all jene, die vielleicht schon dran waren,

Gesund bleiben, F.