Wenn die Sidebar einer Webseite Inhalte verdeckt: Beispiel Pure Css Tooltip – Plugin für Joomla
Wie vielleicht einige Besucher bereits wissen, betreibe ich „nebenher“ noch eine Homepage, auf der ich meine selbst erstellten Rebusse (Bilderrätsel) veröffentliche. Mittlerweile sind dort bereits einige unterschiedliche Rebusarten vertreten, die ich auch näher beschrieben habe.
Ich gehe aber davon aus, dass nicht jeder gewillt ist, erst die Beschreibungen zu jedem Bilderrätsel zu lesen, bevor er anfängt zu rätseln. Da kam mir der Gedanke ein Infotool zu installieren, das Kurzbeschreibungen zu den einzelnen Rebusarten direkt neben dem Rebusbegriff ermöglicht. So war dann das Plugin Pure CSS Tooltip mein Favorit, weil es mich durch Schlichtheit überzeugte. Somit entsprach es genau meinen Vorstellungen, wie eine Infobox auf meiner Homepage aussehen sollte.
Schönes Tool, aber …
Kaum installiert und konfiguriert stand ich allerdings vor dem Problem, dass bei einigen Beiträgen die Infobox von der Sidebar abgeschnitten wurde, wenn diese bedingt durch die Position des beschriebenen Begriffes über den Artikelrand hinaus ragte.
Da bei diesem Plugin die Möglichkeit besteht, das Layout per CSS zu ändern, begab ich mich also daran, dort sämtliche Einstellungen zu ändern. Z. B. probierte ich es mit Werten wie absolute und relative bis hin zu float + margin-Angabe. Ach und nicht zu vergessen den z-index habe ich auc noch auf einen möglichst hohen Wert gesetzt. Der gewünschte Effekt stellte sich aber nicht ein und die Sidebar verdeckte immer noch die Infobox.
Ursachenforschung
Wie immer in solchen Fällen habe ich dann wieder Google und das Joomla-Forum bemüht. Sollte ich „mal wieder“ die Einzige sein, die mit diesem Problem konfrontiert war? Dann kam mir endlich mal der Gedanke, dass es kein Plugin-Problem war sondern mit meinem Template zusammenhängen könnte. Ich stieß auf eine meiner Lieblingsseiten SELFHTML auf diesen Beitrag, der mich wieder einen Schritt auf meinem Lösungsweg weiter brachte.
Lösung
Also habe ich Firebug (Addon für Firefox) bemüht und festgestellt, dass im Artikel-Content meines Templates der CSS-Befehl hidden eingetragen war. Eine Änderung im Firebug mit dem Wert visible zeigte mir, dass nun die Infobox die Sidebar überlagert und somit komplett angezeigt wird. Also habe ich in der CSS-Datei meines Templates in meinem Editor Notepad++ (ein tolles Editor-Programm, in dem im Gegensatz zum Standard-Editor die Zeilen durchnummeriert sind) die entsprechende Zeile aufgerufen, den Befehl geändert und schon war das Problem gelöst.