Header fixiert

Ruke · 23.05.2013, 21:53

Hallo,

ich melde mich auch mal mit einem Problem.

Ich nutze die Aktuelle Wordpress Version, mit dem Theme "Ever After".
Link zum Theme
Link zur Live Vorschau

Ich möchte nun den Header quasi oben fixieren, sodass dieser nicht mitscrollt.
Gleiches gilt für die Navigation.

Es gibt einen Container namens "Masterhead". Dort ist der gesammte Header + Navi hinterlegt. (Nicht in der Live Vorschau)

In der CSS Datei ist dieser Container so definiert:

#masthead {
	padding: 4.5em 0 2.05em;
	position: relative;
	z-index: 4;
}

Nun gut. Ich habe ein wenig google benutzt und bin unter anderem auf:
position: fixed; gestoßen. Allerdings ist dann der Content hinter dem header.
Nun habe ich Masterhead dann feste höhen und breiten gegeben. Leider alles zerschossen. In diese Richtung habe ich dann noch ein wenig weiter gespielt und bin auch nicht weiter gekommen.

Nun würde ich gerne eine kleine Hilfestellung, wie ich nun den Container "masterhead" oben fixieren kann, sodass dieser nicht mehr mitscrollt.

Falls weitere Informationen benötigt werden, nur fragen

EDIT: Links zum Theme von Forever auf Ever After geändert

derm · 23.05.2013, 22:26

Hi, ich kann mich dem Problem auf jeden Fall annehmen, nur ich weiss nicht ob ich es richtig verstanden habe... möchtest du es so?

Ruke · 23.05.2013, 23:27

Peinlicher Fehler.
Es ist nicht das Theme "Forever", sondern das Theme "Ever After".
Link zum Theme
Link zur Live Vorschau

Allerdings unterscheiden die sich recht wenig, da Ever After auf Forever aufbaut.

Leider kann ich auf dem Screen nicht viel erkennen, da es ja im eigentlichen um das Scrollen geht. Wenn man scrollt, sollen nur die Beiträge sich "bewegen" und nicht der Header und die Navi. Die sollen quasi immer angezeigt werden.
Auf dem Screen ist der Content hinter dem header oder?

EDIT:
Ein kleines Beispiel:
http://www.cssplay.co.uk/layouts/body2.html

Hier sieht man, dass der Content "scrollbar" ist, jedoch der Header immer angezeigt wird.

EDIT2:

Hier sieht man es noch deutlicher.
http://limpid.nl/lab/css/fixed/header
Das Grün kann man sich bei meinem Theme als Header+Navigation vorstellen. Diese sollen immer oben angezeigt werden. Lediglich der Content, der soll "scrollbar" sein.

Delinquenz · 24.05.2013, 09:14

Dann musst du das untere in einem extra Container packen und diesen dann vom Ende des Headers bis zum Ende des Browserfensters sizen. Dazu packste noch ne Scrollbar an dem Container und dann haste dein Ziel, sofern ich dich verstanden habe. Da hat der Header nichts mit zu tun.

tho · 24.05.2013, 13:19

hast du den fehler auch, wenn du ein frisches wordpress mit dem ever after theme versiehst?

Ich glaube es liegt eher an deiner Seite als an dem Theme... vllt kannst du mal den Link zu deinem Blog posten. Dann kann man es direkt ansehen.

Ruke · 25.05.2013, 10:50

Der Link zum Blog ist: www.blogtest.de.vu

tho · 25.05.2013, 11:56

ich kann da keinen fehler feststellen... es scrollt nichts mit aber ganz valide ist dein code nicht....

http://validator.w3.org/check?uri=ht...Inline&group=0

Ruke · 25.05.2013, 12:06

Der Code ist nicht bearbeitet. Das ist der Originalcode.

Der Text von "Delinquenz" hat mich ein wenig weiter gebracht. Ich werde es mal testen