Hi Ingo!

Ich habe auf deiner Seite einen schönen Effekt gesehen, und zwar wenn man über einen Link mit dem Cursor fährt erscheint, eine Box in der Informationen stehen, z.B. W3C oder Ähnliches.
Kannst du mir vielleicht erklären, wie du das machst? Wie ich dich kenne, ist das mit CSS möglich, allerdings weiß ich nicht wie. Eine Beschreibung oder ein kleiner Code wären hilfreich, oder auch ein Stichwort über welches ich mich weiter informieren kann.

Schöne Grüße
Thorsten

P.S. Super Seite!

Hi Thorsten,
danke für die Rückmeldung.

Mit der Infobox hast Du recht: die habe ich ausschliesslich über CSS realisiert. Der auf das Wesentliche reduzierte Code:

acronym a span { position:absolute; left:12em; margin-top:1.3em; margin-left:56px; padding:1em; visibility:hidden; }
acronym a:hover span { visibility:visible; background:white; border:1px solid #c30; }

W3C Infotext...

Ist so zwar valide und funktioniert; aber nur, weil die Browser sich in diesem Fall alle nicht 100%ig an den Standard halten ;-)

Falls Du damit noch nicht ganz klar kommst, könnte ich auch einen Tips&Tricks Artikel hierzu erstellen.
Gruß
Ingo

Hi Ingo!

Klappt alles prima!
Kannst aber trotzdem einen Artikel dazu schreiben für die Allgemeinheit ;-)

Ich danke dir!

Gruß
Thorsten

Hi,

bei meinen Tips und Tricks findet ihr jetzt auch den Artikel Infobox im Textbereich über CSS einblenden.

Gruß
Ingo

Hallo Ingo,

ich habe versucht, deine Infobox in eine meiner Seiten einzubauen.
Ein Beispiel findest du unter http://www.maloer.org/deko2.htm
das Stylesheet unter http://www.maloer.org/screen.css

Es geht um den Pseudolink "Tom Mount" (nach dem Zitat, vor den Fotos); dabei gibt es (wie so oft) ein Problem im IE6 (ältere nicht getestet):

Die "normale" Formatierung des inaktiven Links wird dabei nicht überschrieben, sondern nur zusätzlich angezeigt (im Mozilla natürlich alles paletti...). Was mache ich falsch?

Beste Grüsse
Alfie

Hi,
meinst Du den im IE gestrichelten border-bottom, obwohl Du dotted definiert hast? Dies ist einer der Fehler des IE: er kann dotted erst ab 2px Breite anzeigen.
Gruß
Ingo

Hallo Ingo,

nein, nicht wirklich. Der IE6 zeigt die gestrichelte Linie mit 1px sehr wohl an, aber unter der normalen Link-formatierung (grün unterstrichen). Das ist so auf allen Seiten unter http://www.maloer.org mit einer einzigen Ausnahme (http://www.maloer.org/anfang.htm); alles mit dem gleichen Stylesheet

Beste Grüße
Alfie

Korrektur: keine Ausnahme (war nur ein ungeleerter Cache), also überall dotted unterhalb von underline...

Hi,
auf diesen Seiten sehe ich nun das Problem. Übrigens zeigt der IE den border-bottom hier nicht dotted, sondern dashed an (denn dotted kann er wirklich erst ab 2px). Dein Problem ist aber tatsächlich das normale text-decoration der Links. Dieses wird hier im IE (außer bei :hover) angezeigt, weil die Pseudoklasse a:link höher gewichtet wird als a.infobox. Eigentlich sollten beide Selektoren gleichstark sein und die letzte Angabe (also .infobox) "gewinnnen", wie es im Mozilla auch umgesetzt wird.
a.infobox:link, a.infobox:visited, a.infobox:active { text-decoration:none; } sorgt für eine höhere Spezifität und beseitigt die Unterschiede.

Übrigens solltest Du am margin-top noch etwas rumschrauben; der IE setzt die Infobox zu hoch. Notfalls mit CSS-Browserweiche.
Gruß
Ingo

Na ja, wieder einmal zeigt sich der IE als etwas mühsam.

Vielen Dank für die Hilfe; deine Infobox ist jedenfalls sehr gelungen (und für "Kleinweich" ist wie so oft Basteln angesagt...)

Alfie