Problem mit Script

[Gunnar Bittersmann]

@@Rolf B

1. Einen Container um das nav Element herumlegen.

Buh!

Dem gebe ich die Klasse "beeHive", denn Honig findet man bekanntlich im Bienenstock 🐝🐝🐝.

… auf Bäumen.

Eines Tages, als er einen Spaziergang machte, kam er an eine freie Stelle inmitten des Waldes, und inmitten dieser Stelle stand eine große Eiche, und vom Wipfel des Baumes kam ein lautes Summgeräusch. Winnie-der-Pu setzte sich an den Fuß des Baumes, steckte den Kopf zwischen die Pfoten und begann zu denken.
Zuallererst sagte er sich: »Dieses Summgeräusch hat etwas zu bedeuten. Es gibt doch nicht so ein Summgeräusch, das so einfach summt und summt, ohne daß es etwas bedeutet. Wenn es ein Summgeräusch gibt, dann macht jemand ein Summgeräusch, und der einzige Grund dafür, ein Summgeräusch zu machen, den ich kenne, ist, daß man eine Biene ist.«
Dann dachte er wieder lange nach und sagte: »Und der einzige Grund dafür, eine Biene zu sein, den ich kenne, ist, Honig zu machen.«
Und dann stand er auf und sagte: »Und der einzige Grund, Honig zu machen, ist, damit ich ihn essen kann.«
Also begann er, den Honig-Baum hinaufzuklettern.
(A.A. Milne, Pu der Bär)

2. Den Bienenstock platzieren wir mit CSS fixed in die Bildschirmmitte:

   .beeHive {
      position: fixed;
      left: calc(50vw - 80px);
      top: calc(50vh - 70px);
   }

Wo kommen die 80px und 70px her?

Verständlicherer Code dürte das sein:

{
	left: 50%;
	top: 50vh;
	transform: translate(50%, 50%);
}

Die Prozentangaben beziehen sich auf Breite bzw. Höhe des Elements.

Und bei left muss die Angabe in %, nicht vw sein, wenn das Ding auch in der Mitte sein soll, wenn eine Scrollbar einen Teil der Breite beansprucht.

LLAP 🖖