probleme bei anzeige in '<a href' mit hover effekt in CSS

  • hallo ratgeberIn

    mit dem codeschnipsel:

    code CSS:
    .......
    div.menue table .orange_passiv
    {
    color: #F79D00;
    }

    div.menue table a.orange_passiv:hover
    {
    background-image:url(grafics/markorange.png); background-repeat:no-repeat; background-position:right;
    }

    code HTML:
    .......
    <tr>
    <td width="165px" nowrap>
    <a class="orange_passiv" href="seite5.html">Das Unternehmen
    </a>
    </td>
    </tr>
    ......

    erscheint wie gewünscht der link mit text 'Das Unternehmen',
    und wenn mit der maus darübergefahren wird, erscheint die grafik wie im CSS angegeben (:hover - ein Pfeilsymbol als orientierung)

    das ganze ist eine von diversen zeilen in der menusteuerung (alle funktionieren nach der gleichen logik haben aber unterschiedlich lange anzeigetexte)

    problem:
    das pfeilsymbol erscheint direkt nach dem anzeigetext ('Das Untenehmen'), und nicht wie gewünscht am rechten rand der zelle (<td width="165px")

    frage:
    wie kann ich erreichen, dass das pfeilsymbol am rechten rand der zelle erscheint?

    danke für eure hinweise
    gruss
    martin

  • Himartin-baertschi,

    im Tabellenlayout würde ich der Einfachheit halber das Hintergrundbild(Pfeil) genau so breit und hoch erzeugen wie erwünscht und den Pfeil auf die rechte Seite packen. Dann sparst Du Dir das das geschiebe und das Bild wird nur ein / oder ausgeblendet.

    Gruß yeti66 :wink:

  • hallo yeti66

    danke dir, habe das problem bereits gelöst.

    im CSS (a.orange_passiv) habe ich inzugefügt
    width: 100%;
    display: block;


    funktioniert bestens.
    gruss
    martin