Arthur: Von Elternelement lösen

Beitrag lesen

hallo,

ich möchte für mobile Geräte so wenig wie möglich Quelltext nutzen. Deshalb hatte ich die Idee, eine Liste zu erstellen, in der noch eine Liste ist.

Wird die Liste bei mobilen Geräten verwendet z.B. weite Seite kleiner 500px, dann wird die komplette Liste als ein Stück angezeigt. Darüber für große Bildschirme soll die Liste Gelöst werden und am rechten Rand fixiert werden.

z.B.

<ul>
<li>Link Menu 1</li>
<li>Link Menu 1</li>
<li>Link Menu 1</li>
<li>Link Menu 1</li>
<li>Menu 2
<ul>
<li>Link Menu 2</li>
<li>Link Menu 2</li>
<li>Link Menu 2</li>
<li>Link Menu 2</li>
</ul>
</li>
</ul>

Allerdings verhält sich position: fixed und absolute genau wie es sich sonst immer auch verhält, am Elternelement ausgerichtet. Da ich nicht weiß wo der Rand ist bei wie viel Pixel, kann ich nicht mit z.B. right: -200px usw arbeiten.

Gibt es einen Workaround oder muss ich die gleiche Liste nochmal in mein Dokument einfügen, wo es Elternlos bis auf <body> ist, sodass ich es rechts am Rand ausrichten kann?

mfg Arthur