3 verlinkte grafiken mit xhtml nebeneinander

[Andreas]

hi
ich hab folgendes, verzwicketes problem:

moechte meine seite in xhtml-strict bauen was ja soweit kein
problem waer.

doch ich habe 3 links (grafiken) die nebeneinander stehen sollen,
was ich nicht richtig hinbekomme.
also es sollen 3 grafiken, die als link fungieren und die
nebeneinander stehen

zuerst hab ich es mit einem aufbau a la:

<a href="">
   <span style="float:left;background-image:url(...)" /> </a>
<a href="">
   <span style="float:left;background-image:url(...)" /> </a>
<a href="">
   <span style="float:left;background-image:url(...)" /> </a>

versucht, doch das zerreisst opera.

und wenn ich es so mache:

<div> <a> <div style="background-image" /> </a> </div>
<div> <a> <div style="background-image" /> </a> </div>
<div> <a> <div style="background-image" /> </a> </div>

ist es nicht xhtml conform, weil ein inline element ein block element
einschliesst. aber ich brauch ein block element, das erstens die
groesse des elements ohne inhalt (also nur mit hintergrundgrafik) erhalten bleibt und ich zweitens per css das hovern definieren kann.

ich hab mich jetzt schon ein paar stunden mit span,div,a,p und sogar img gespielt, bin aber nie zu einen befriedigenden ergebnis gekommen das mit opera,netscape und ie hingehaut haette.
nur jeweils immer fuer einen von den drein ;-)

die page in der netscape -conformen form ist unter
http://www.stefankarl.com/stu.ff/vespa
zu bewundern.

waer toll wenn mir jmd helfen kann, ich hab das
forum leider erfolglos durchforstet.

andreas

[Der Martin]

Hallo,

zuerst hab ich es mit einem aufbau a la:
<a href=""> <span style="float:left;background-image:url(...)" /> </a>
<a href=""> <span style="float:left;background-image:url(...)" /> </a>
<a href=""> <span style="float:left;background-image:url(...)" /> </a>

das wird nix - erstens hat das a-Element ja keinen Inhalt mehr, weil du das darin enthaltene span floatest, zweitens hat auch das span selbst als neutrales Element keinen Inhalt. Das Ergebnis: Die Links sind nutzlos.

versucht, doch das zerreisst opera.

<div> <a> <div style="background-image" /> </a> </div>
<div> <a> <div style="background-image" /> </a> </div>
<div> <a> <div style="background-image" /> </a> </div>
ist es nicht xhtml conform, weil ein inline element ein block element einschliesst.

Ja, außerdem fragt man sich, wozu du die vielen div-Container brauchst.

aber ich brauch ein block element, das erstens die groesse des elements ohne inhalt (also nur mit hintergrundgrafik) erhalten bleibt und ich zweitens per css das hovern definieren kann.

Warum muss es ein Blockelement sein? Mach doch das a-Element selbst zum Blockelement und floate es. Und die darin enthaltene Grafik ist auch bestimmt kein Hintergrundbild, sondern reeller Inhalt.

die page in der netscape -conformen form ist unter
http://www.stefankarl.com/stu.ff/vespa/
zu bewundern.

So long,
 Martin

[Andreas]

Vielen Dank fuer eure Hilfe
Bin dem Problem damit her geworden.

Die anderen Fehler waren bloss vorhanden weil ich
fuer den Anfang erst mit Mozilla gearbeitet hatte und
somit sie noch nicht entdeckt hatte, aber es war
dann kein Problem sie auch noch loszu werden.

Aber an meinem Hauptproblem waer ich allein verzweifelt...

[Detlef G.]

Hallo andreas

ich hab folgendes, verzwicketes problem:

Das Problem, welches du uns nennst, ist das kleinste Problem, das deine
Seite hat.
Deine Seite enthält absolut keine Inhalte, außer:
"Herzlich Willkommen auf der Predators Garage Webseite!
Bei uns finden Sie einfach alles über Vespa-Roller..."

(Schalte mal CSS oder/und Híntergrundgrafiken aus!)

doch ich habe 3 links (grafiken) die nebeneinander stehen sollen,
was ich nicht richtig hinbekomme.

Nein, du hast leere, inhaltslose Elemente mit Hintergrundgrafiken!

also es sollen 3 grafiken, die als link fungieren und die
nebeneinander stehen

Warum nimmst du dann keine Grafiken, ordentlich mit Alternativtext versehen?
Und warum floatest du dann nicht die Links?

ist es nicht xhtml conform, weil ein inline element ein block element
einschliesst. aber ich brauch ein block element, das erstens die
groesse des elements ohne inhalt (also nur mit hintergrundgrafik) erhalten bleibt und ich zweitens per css das hovern definieren kann.

Wozu brauchst du ein Blockelement im Inlineelement?
Du kannst ohne Probleme Inlineelemente nehmen, und diesen dann die
passende display-Eigenschaft zuweisen.

... ich zweitens per css das hovern definieren kann.

Und warum kein img?
(Bildwechsel mit CSS mal ganz anders)

ich hab mich jetzt schon ein paar stunden mit span,div,a,p und sogar img gespielt

Warum?
Das Element bestimmt die Struktur der Inhalte, nicht deren Aussehen!
Für das Aussehen/Design ist CSS zuständig.

Auf Wiederlesen
Detlef

[Gunnar Bittersmann]

Hello out there!

Bildwechsel mit CSS mal ganz anders

Ich darf dich zitieren? „Schalte mal CSS oder/und Híntergrundgrafiken aus!“

Mit CSS an, Bildanzeige aus verschwindet der verlinkte Text beim Drüberfahren.

Für Hover-FX mit Bildern ist wohl doch JavaScript Mittel der Wahl. Clients ohne JavaScript haben halt keine Hover-FX, na und?

See ya up the road,
Gunnar

[Detlef G.]

Hallo Gunnar

Mit CSS an, Bildanzeige aus verschwindet der verlinkte Text beim Drüberfahren.

Na und?
Wenn der verlinkte Text beim drüberfahren verschwindet, ist das vielleicht
nicht schön, vielleicht im ersten Augenblick auch irreführend, aber es ist
erstmal überhaupt ein Linkinhalt zu sehen.
Die Seite des OP bestand nur aus leeren Links mit Hintergrundbild, ohne
Inhalt, damit ...

... ich zweitens per css das hovern definieren kann.

Dagegen ist der Bildwechsel mit CSS ein ganzes Stück besser.

Für Hover-FX mit Bildern ist wohl doch JavaScript Mittel der Wahl.

Was der OP wohl nicht wollte.

Und ich frage mich wirklich, ob für den Hovereffekt extra Javascript
verwendet werden sollte, wenn die Seite sonst auch vollständig ohne auskäme.

Auf Wiederlesen
Detlef