Bewerber: Link-Problem

Hallo,

ich möchte erreichen, dass beim Überfahren eines Links ein 130-Pixel breiter gestrichelter Rahmen angezeigt wird. Im IE funktioniert folgndes CSS:

a.nav:hover {
width:130px;
font-family:Arial;
font-size:12pt;
font-weight:bold;
color:#FFFFFF;
text-decoration:none;
border-color:#FFFFFF;
border-style:dashed;
border-width:thin;
}

In Opera wird die Breite ignoriert und der Rahmen "klebt" direkt um den Link. Warum? Wie kann ich das Problem lösen?

MfG,
Bewerber

  1. Hi,

    ich möchte erreichen, dass beim Überfahren eines Links ein 130-Pixel breiter gestrichelter Rahmen angezeigt wird. Im IE funktioniert folgndes CSS:
    [...]
    In Opera wird die Breite ignoriert und der Rahmen "klebt" direkt um den Link. Warum? Wie kann ich das Problem lösen?

    Indem du dem Link das Verhalten eines Blocklevel-Elementes durch Zuweisen der Eigenschaft "display:block" aufzwingst. Das a-Element ist von Haus aus ein Inline-Element, insofern ist die Anzeige in Opera korrekt.

    Torsten

    1. Hi,

      Indem du dem Link das Verhalten eines Blocklevel-Elementes durch Zuweisen der Eigenschaft "display:block" aufzwingst. Das a-Element ist von Haus aus ein Inline-Element, insofern ist die Anzeige in Opera korrekt.

      display:block; funktioniert leider nicht, habe es eben ausprobiert.

      MfG,
      Bewerber

      1. Indem du dem Link das Verhalten eines Blocklevel-Elementes durch Zuweisen der Eigenschaft "display:block" aufzwingst. Das a-Element ist von Haus aus ein Inline-Element, insofern ist die Anzeige in Opera korrekt.
        display:block; funktioniert leider nicht, habe es eben ausprobiert.

        Hast du nur a.nav:hover das display:block zugewiesen, oder auch a.nav:link?

        Torsten

        1. Noch ein Link zur Ergänzung:
          http://css.fractatulum.net/sample/hov2format2.htm

          Viel Erfolg
          Torsten

        2. Hi

          Hast du nur a.nav:hover das display:block zugewiesen, oder auch a.nav:link?

          Mein CSS sieht nun so aus:

          a.nav:link {
          display:block;
          width:130px;
          font-family:Arial;
          font-size:10pt;
          font-weight:bold;
          color:#FFFFFF;
          text-decoration:none;
          border-color:#003399;
          border-style:dashed;
          border-width:thin;
          }
          a.nav:visited {
          display:block;
          width:130px;
          font-family:Arial;
          font-size:10pt;
          font-weight:bold;
          color:#FFFFFF;
          text-decoration:none;
          border-color:#003399;
          border-style:dashed;
          border-width:thin;
          }
          a.nav:hover {
          display:block;
          width:130px;
          font-family:Arial;
          font-size:10pt;
          font-weight:bold;
          color:#FFFFFF;
          text-decoration:none;
          border-color:#FFFFFF;
          border-style:dashed;
          border-width:thin;
          }
          a.nav:active {
          display:block;
          width:130px;
          font-family:Arial;
          font-size:10pt;
          font-weight:bold;
          color:#FFFFFF;
          text-decoration:none;
          border-color:#EEEEEE;
          border-style:dashed;
          border-width:thin;
          }

          In Opera geht es immer noch nicht. Noch eine Idee? Ich habe die Links jeweils in einer Tabellenzelle, aber daran kann es eigentlich nicht liegen, da die Zellen wesentlich breiter sind und es im IE ja auch geht.

          MfG,
          Bewerber

          1. Hallo,

            Hast du nur a.nav:hover das display:block zugewiesen, oder auch a.nav:link?

            Mein CSS sieht nun so aus:

            a.nav {
            display:block;
            }
            a.nav:link, a.nav:visited, a.nav:hover, a.nav:active {
            width:130px;
            font-family:Arial;
            font-size:13px;
            font-weight:bold;
            color:#FFF;
            text-decoration:none;
            border-color:#039;
            border-style:dashed;
            border-width:thin;
            }
            a.nav:hover {
            border-color:#FFF;
            }
            a.nav:active {
            border-color:#EEE;
            }

            Wichtig ist für den Opera, dass a.nav von Anfang an mit display:block dargestellt wird. Die restlichen Veränderungen sind Vereinfachungen. Die Einheit pt ist für Bildschirmschriften nicht geeignet.

            viele Grüße

            Axel

            1. Danke!!! Es läuft nun! Ist es möglich dieses CSS auch im NN 4.7 irgendwie zum Laufen zu bringen?

              MfG,
              Bewerber

              1. Hallo,

                Ist es möglich dieses CSS auch im NN 4.7 irgendwie zum Laufen zu bringen?

                Ich habe _keine_ Ahnung, glaube aber eher nicht. <ironie>Es ist ja auch nicht möglich, die neuesten Spiele auf einem 286-iger AT mit 2MB RAM zum Laufen zu bringen.</ironie>

                Im Ernst: Warum willst Du diesen Museumsbrowser noch unterstützen?

                viele Grüße

                Axel

              2. Moin!

                Danke!!! Es läuft nun! Ist es möglich dieses CSS auch im NN 4.7 irgendwie zum Laufen zu bringen?

                NN4 kann kein :hover. Und hat vermutlich Probleme mit display:block für den Link. Also wirst du dort auf diesen Effekt komplett verzichten müssen.

                - Sven Rautenberg

                --
                ss:) zu:) ls:[ fo:} de:] va:) ch:] sh:) n4:# rl:| br:< js:| ie:( fl:( mo:|
              3. moin Bewerber,

                nachdem ich mich gut 2 Wochen fast nur mit dem Problem display:block für NN 4.7x rumgeschlagen habe, kann ich mit ruhigem Gewissen sagen, nein.
                In einer "Fachzeitschrift" wurde empfohlen, diesen "Block" durch   zu erzwingen, aber dies kann und sollte keine Lösung sein.

                mfg. YLT

            2. Hallo Axel,

              Vielen Dank für deinen Beitrag. Als ich ihn durchlas, dämmerte mir, daß dies die Lösung für mein Anzeigeproblem bezüglich meinem Menü in Opera sein könnte.
              Tatsächlich war es das auch, nun funktioniert mein Menü auch im Opera 6.04 fast wie gewünscht.

              Nochmals Danke, auch wenn du nichts von deiner guten Tat wusstest. ;-)

              Gruß

              Kurt

              --
              "Mut ist eine Tugend, doch Angst beweist Vernunft, Bewusstsein und Phantasie. Die Kunst ist es abzuwägen."
              http://faq.united-web.at
              http://elektro-dunzinger.at
              http://shop.elektro-dunzinger.at