Tooltip 1c nur mit CSS3

Im August 2025 verwendetes Template: cmsimplexh-172-tooltip1b. Das ist mit einer klassischen Box, jedoch deutet nun ein Pfeil in Richtung des Wortes.

Besuch im Zoo und nicht im Museum.

Zuerst ein Wort einfügen und die 'class tooltip' aktivieren. Danach das entsprechende Template auswählen: (hier) cmsimplexh-172-tooltip1b. 
Anschließend wird genau dieses 1:1 kopiert.

Das gewählte Wort wird im HTML-Editor markiert und sofort danach über den Button Bild ein entsprechendes Bild ausgewählt. Speichern und anschließend im Quellmodus checken, ob der Funktionsaufruf richtig ist und ob <div> statt <p> dort steht. 
Anschließend noch den Text für den Tooltip ändern. Wenn der Text größer erscheinen soll, so kann dies span style="font-size: 15pt;" zwischen Aufruf des Bildes und dem Funktionsaufruf der Toolbox 'class' eingefügt werden.

Anschließend noch den Text für den Tooltip ändern. Wenn der Text größer erscheinen soll, so kann dies span style="font-size: 15pt;" zwischen Aufruf des Bildes und dem Funktionsaufruf der Toolbox 'class' eingefügt werden.

Leider funktioniert es nicht so, wie ich mir das wünsche! So sollte es aussehen! Der Tooltip soll nicht am rechten Bildrand auftauchen, sondern so wie in der Bildcollage dargestellt. 

Das habe ich eingefügt, aber es funktioniert nicht.

CSS des Templates (in .css umbenennen)     —       eingefügte Daten (statt Bild)