jan b: div#menue a

hallo forum,

ich habe folgenden code:

css:

div#menue a {
 width:180px;
 border-right: 3px double;
 margin-right: 1px;
 padding-right: 3px;
 padding-top: 2px;}

div#menue a:hover {
 width:180px;
 border-right:4px solid;
 margin-right:0;
 padding-right:3px;
 text-decoration:none;}

und im body:

<div id="menue">
               <a href="buch.html" target="inhalt" class="inhalt">Buch</a><br>
               <a href="film.html" target="inhalt" class="inhalt">Film</a><br>
               <a href="musik.html" target="inhalt" class="inhalt">Musik</a><br>
</div>

ie5.5 stellt alles so dar, wie es sein soll, d. h. er zeigt den rand nach 180px an.

mozilla hingegen setzt den rand direkt an das wortende ... hat jemand eine idee, wie ich mozilla dazu bringe, den rand dort zu setzen, wo ich ihn haben will?

für tips wäre dankbar,
jan

  1. Hi!

    ie5.5 stellt alles so dar, wie es sein soll, d. h. er zeigt den rand nach 180px an.

    Ja, er machts mal wieder so wie es sich das W3C nicht vorgestellt hat. Die Breite von Inlinelementen (abgesehen von Ausnahmen wie img oder object) wird allein von ihrem Inhalt bestimmt.

    mozilla hingegen setzt den rand direkt an das wortende ... hat jemand eine idee, wie ich mozilla dazu bringe, den rand dort zu setzen, wo ich ihn haben will?

    Füge ein display: block in das Stylesheet ein und nimm evtl. die br's weg.

    Gruß Herbalizer

    1. Hi!

      re: hi!

      Füge ein display: block in das Stylesheet ein und nimm evtl. die br's weg.

      schönen dank auch!

      Gruß Herbalizer

      gruß
      jan

  2. hallo forum,

    Tach,

    ich habe folgenden code:
    css:
    div#menue a {
    width:180px;

    Bieeep.
    a ist ein "non-replaced" inline-Element, darf also nicht mit width formatiert werden.

    border-right: 3px double;
    margin-right: 1px;
    padding-right: 3px;
    padding-top: 2px;}

    div#menue a:hover {
    width:180px;

    Bieep: siehe oben

    border-right:4px solid;

    Bieep:
    die Border-color sollte auch noch angegeben werden

    margin-right:0;
    padding-right:3px;
    text-decoration:none;}

    und im body:

    <div id="menue">
                   <a href="buch.html" target="inhalt" class="inhalt">Buch</a><br>
                   <a href="film.html" target="inhalt" class="inhalt">Film</a><br>
                   <a href="musik.html" target="inhalt" class="inhalt">Musik</a><br>
    </div>

    ie5.5 stellt alles so dar, wie es sein soll, d. h. er zeigt den rand nach 180px an.

    ie5.5 stellt möglicherweise alles so dar, wie Du es gerne hättest,
    ob das auch so ist, wie es sein soll, steht auf einem anderen Blatt.

    mozilla hingegen setzt den rand direkt an das wortende ... hat jemand eine idee, wie ich mozilla dazu bringe, den rand dort zu setzen, wo ich ihn haben will?

    Warum auch nicht? Die border ist beim a-Element definiert.
    Da width für a nicht zulässig ist, wird die width ignoriert und die border neben dem Element angezeigt.