• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

position:fixed (header); Korrektur ALLER FOLGENDEN sections/divs nötig?

NETrix

Neues Mitglied
HTML5 / CSS3
Eine Frage zum besseren Verständnis der Codierung, Newbie

Ich habe mit position:fixed meinen header oben auf denViewport fixiert. Es hat einwandfrei funktioniert, aber ab jetzt muss ich alle folgenden Sections/Divs korrigieren, um es in die Position auf dem Bildschirm zu bringen, wo ich es haben möchte.
Dieses Verhalten macht für mich Sinn, denn die Position: fest / absolut nimmt das Element aus der Fluss.
Aber ... gibt es einen Weg, um wieder in den normalen Fluss zu kommen, damit ich nicht jedes Element explizit mit Position: relativ oder absolut ansteuern muss,damit es seine Position einnehmen soll?
Ist es eine Tatsache, dass, sobald ich das Element Position: fest / absolut verwende, ich alle folgenden Inhalte / Abschnitte / divs korrigieren muss?
Wie gehen Sie mit einer solchen Situation um?
Dies ist kein großes Problem für mich, aber es bläht meinen Code auf und macht es hässlicher.
Wenn es nicht unnötig ist, würde ich es gerne vermeiden...
 
Hallo

Das hört sich an also ob du deine Seite unnötig kompliziert erstellst.

Üblicherweise muss nur der Abstand des ersten folgenden Containers zum body erhöht werden und damit rutschen auch alle weiteren Container weiter runter.

Gruss

MrMurphy
 
hallo MrMurphy...

Wenn ich so weiter gemacht hätte, wäre es so gekommen, wie du behauptest... deswegen musste ich diese Sache unbedingt für mich klären... Ich habe den Trixx jetzt raus...
Ich setze den folgenden container auf position: relative (Elternelement) und das Kindelement auf position: absolute... Und dann läuft es auch ohne positionsangabe....
Vielen dank für eure Hilfe... sehr nett... :)

LG
NETrix

---------------------------------------
Funktioniert doch noch nicht so wie ich es sein soll... da die folgenden Container die Differenz der Höhe des Headers nicht mit einberechnen...
Ich veröffentliche mal den Code so schnell es geht... vielleicht ist der Fehler dann besser zu klären.... :(

LG
NETrix
 
Zuletzt bearbeitet:
Das Problem lag an einer Wissenslücke des Elements"Position:". Ich hatte gedacht es zu verstehen, war aber nicht so.
Um einen HEADER zu fixieren, muss man einen vorherigen Bereich (z.b. div/wrapper) mit positon:relative kennzeichnen und Diesen dann mit "top" die Höhe des Headers angeben. Somit zieht sich der Bezugspunkt vom Rootelement (HTML-Tag) auf den neuen relativen Bezugspunkt (z.b. div/wrapper)...

Vielen dank...MrMurphy für die grobe Richtungsanzeige wo ich meinen Denkfehler zu suchen hatte... :)
 
Zurück
Oben