Andreas: 3 verlinkte grafiken mit xhtml nebeneinander

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

  1. 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

    --
    Die letzten Worte der Challenger-Crew:
    Lasst doch mal die Frau ans Steuer!
    1. 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...

  2. 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

    --
    - Wissen ist gut
    - Können ist besser
    - aber das Beste und Interessanteste ist der Weg dahin!
    1. 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

      --
      “Remember, in the end, nobody wins unless everybody wins.” (Bruce Springsteen)
      1. 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

        --
        - Wissen ist gut
        - Können ist besser
        - aber das Beste und Interessanteste ist der Weg dahin!