2023: Elemente vor Hintergrundbild immer vertikal mittig?

[ad_1]

Hallo,
entscheidend ist dabei der Abstandhalter unter dem Navigations-Block im Cover-Block.

nachfolgend ein kleines Video zur Veranschaulichung (bei Klick auf das Video, wird das Video vergrößert dargestellt):

Viele Grüße
Hans-Gerd

Danke für die aufürhliche Antwort mit dem GIF.

Damit kann ich schon mal mein Menü nach oben schieben. Nur ist mir noch nicht ganz klar, wie ich die Höhe korrekt setze. Das Hintergrundbild ist auf bildschirmfüllend eingestellt. So sollen auch die Elemente davor sein, da unter dem Menü bereits die zweite Seite als onepager beginnt wie bei deiner anderen (übrigens sehr guten) Anleitung geschrieben: Als Unterschied hab ich den Anker auf die gesamte Gruppe/Seite statt auf einen Abstandshalter gesetzt (werde mal probieren, ob das genauso gut geht).

Also Wenn ich den Abstandshalter z.B. auf 70% Höhe setzen möchte, müsste ich die Gruppe, in der die Navigation sitzt, auf 30% Höhe setzen. Nur kann ich weder bei der Gruppe, noch bei der Zeile innerhalb der Gruppe die Einstellung „Höhe“ und „%“ finden. Auch beim Abstandshalter lässt sich „%“ nicht auswählen. Gibt es da eine Möglichkeit?

  • Diese Antwort wurde geändert vor 2 Stunden, 44 Minuten von wpzugang.
  • Diese Antwort wurde geändert vor 2 Stunden, 42 Minuten von wpzugang.

Hallo,

Als Unterschied hab ich den Anker auf die gesamte Gruppe/Seite statt auf einen Abstandshalter gesetzt (werde mal probieren, ob das genauso gut geht).

Warum wolltest du das so setzen?
Ohne Link zur Website von dir, wo man sich das ansehen kann, wird das vermutlich kaum nachvollziehbar sein, was du vorhast. 🤷‍♂️

Freut mich übrigens, dass mein Beitrag, den du oben verlinkt hast, hilfreich für dich ist. 😉

Viele Grüße
Hans-Gerd

Warum wolltest du das so setzen?

Weil ich dachte, dass ich mir so den Abstandshalter spare, da jede Seite ja bei mir eh in eine Gruppe soll. Aber das kann ich dann ja testen und wenn es nicht wie gewünscht funktioniert, habe ich ja noch deine Anleitung mit dem Abstandshalter als Anker.

Habe herausgefunden, woran es lag. Sowohl das Plugin „Background AWB“ als auch der Cover-Block habe eine Einstellung für die Position des Inhalts. So geht es auch ohne Abstandshalter:
https://www.aeropano.net/wordpress-img/background_vertical_top.JPG
https://www.aeropano.net/wordpress-img/cover_top.JPG

Trotzdem hätte ich für die Abstandshalter gerne noch eine Prozentangabe zur Auswahl.
https://www.aeropano.net/wordpress-img/hight_spacer.JPG

Die Seite ist noch nicht online aber ich denke, die Screenshots reichen.

  • Diese Antwort wurde geändert vor 52 Minuten von wpzugang.

Hallo,
wenn du den Navigations-Block oben im Cover-Block positionieren willst, dann wirst du das m. E. nicht ohne einen Abstandhalter hinbekommen.
Dafür würde ich persönlich auch kein zusätzliches Plugin verwenden.

Mir ist allerdings immer noch nicht klar, warum du unbedingt darauf bestehst, die Höhe des Abstandhalters über eine Prozentangabe anzugeben.

Laut theme.json sind zwar die units px, em, rem, %, vw, und vh möglich, aber ich vermute, dass das bei dem Abstandhalter nicht unterstützt wird, siehe hier (ab Zeile 99 in der theme.json):

			"units": [
				"%",
				"px",
				"em",
				"rem",
				"vh",
				"vw"
			]

Aber wie gesagt, welchen Vorteil du bei Verwendung von % siehst, ist mir unklar. Siehe auch z. B. hier.

Viele Grüße
Hans-Gerd

Wenn es über vh oder vw geht, muss es natürlich nicht % sein. Mit meinem begrenzten HTML und CSS-Wissen schien mir % am logischsten. Soll halt nur so bildschirmfüllend wie der Hintergrund sein und oben und unten bündig abschließen. Weiß nicht, welche Einheit der Hintergrund-Block für die bildschirmfüllende Anordnung verwendet.

wenn du den Navigations-Block oben im Cover-Block positionieren willst, dann wirst du das m. E. nicht ohne einen Abstandhalter hinbekommen.

So wie bei meinem Screenshot geht es doch aber nun. Habe hier keinen Abstandshalter mehr drin:
https://www.aeropano.net/wordpress-img/background_vertical_top.JPG
https://www.aeropano.net/wordpress-img/cover_top.JPG

Das Plugin „Background AWB“ habe ich nur wegen der Möglichkeit genommen, im Hintergrund Videos abspielen zu können. Sowohl selbst-gehostete als auch Links aus Vimeo oder Youtube. Wenn es dazu eine pluginfreie-Alternative gibt, bin ich natürlich auch dafür offen.

[ad_2]

 

This site will teach you how to build a WordPress website for beginners. We will cover everything from installing WordPress to adding pages, posts, and images to your site. You will learn how to customize your site with themes and plugins, as well as how to market your site online.

Buy WordPress Transfer