Probleme mit padding

[freakXHTML]

Hallo zusammen,
ich möchte in einer Navigationsleiste einen kleinen Effekt einbauen. Wenn ich mit der Maus über einen Link gehe, soll dieser um ein paar Pixel nach rechts verschoben werden. Leider verschiebt sich dabei die ganze restliche Leiste mit. Was mache ich dabei falsch?

Hier der Quelltext:
CSS:

#navigation a:link {text-decoration: none; color:black;}
#navigation a:hover{font-weight:bold; color:#4B2013;}

<div id="navigation">
   <table  style="text-align:center; width:950px;" cellpadding="5px" >
    <tr style="height:28px;">
     <td>Home</td>
     <td><a href="##">Rubrik 1</a></td>
      ...
    </tr>
</div>

Wenn ich nun mit der Maus auf "Rubrik 1" fahre, dann verschiebt sich die ganze Leiste?

Könnt ihr mir helfen, diesen Fehler zu beheben?
Vielen Dank
lg, freakXTHML

 

[Icy]

Du redest von einer "Liste" und benutzt dabei aber eine Tabelle, wie darf ich das verstehen?
Lösch die Tabelle und erstelle eine Liste.

MfG Icy

 

[freakXHTML]

Hi,
sorry für meine Ungenauigkeit: Ich benutze keine Liste, sondern eine Tabelle!

Trotzdem muss doch das Problem auch mit einer Tabelle zu meistern sein!?

Vielen Dank
lg, freakXHTML

PS. Wo rede ich eigentlich von einer Liste???? ;) Ich sehe nur "Leiste"

 

[_Thor_]

Du redest von einer "Liste" und benutzt dabei aber eine Tabelle, wie darf ich das verstehen?

Nein, er reden von "Leiste", nicht von "Liste", trotzdem hast du natürlich recht, ein Menü sollte als Liste ausgezeichnet werden.

Ich vermute mal, das liegt an dem font-weight: bold;

Dadurch benötigt der Inhalt mehr Platz, also vergrößert sich die Zelle und verschiebt die gesamte Zeile, aber ohne Link zur Seite ist das nur geraten.

 

[freakXHTML]

Mmmh...mir ist schon klar warum sich die LEISTE verschiebt, doch frage ich mich, ob ich diesen unerwünschten Nebeneffekt nicht irgendwie beseiten kann!

Dazu brauche ich genau eure Hilfe!
Warum soll ich denn überhaupt hier eine Liste machen? Die Navigationspunkte sollen nebeneinander stehen. Ich müsste dann erst umständlich mit "display" den Zeilenumbruch entfernen!

Vielen Dank für euer Bemühen
lg, freakXTHML

 

[_Thor_]

Mmmh...mir ist schon klar warum sich die LEISTE verschiebt, doch frage ich mich, ob ich diesen unerwünschten Nebeneffekt nicht irgendwie beseiten kann!

Versuch es, indem du die Breite der Zelle selber setzt.

Warum soll ich denn überhaupt hier eine Liste machen? Die Navigationspunkte sollen nebeneinander stehen. Ich müsste dann erst umständlich mit "display" den Zeilenumbruch entfernen!

Weil ein Menü eine Aufzählung von Links ist und eine Aufzählung als Liste ausgezeichnet wird. Tabellen sind für tabellarische Daten, dazu zählt das Menü nicht.
Die Listenelemente bekommst du ganz einfach mit

li {float: left;}

nebeneinander. Was ist daran umständlich?

 

[freakXHTML]

Hey,
alles hat super geklappt!

Vielen Dank für eure Hilfe
lg, freakXHTML

 

[Efchen]

Warum soll ich denn überhaupt hier eine Liste machen? Die Navigationspunkte sollen nebeneinander stehen. Ich müsste dann erst umständlich mit "display" den Zeilenumbruch entfernen!

Ja, das ist ja auch der Sinn der Sache!
Eine Liste machst Du, wenn Du Daten vorliegen hast, die eine Liste sind. Also z.B. ein Menü. Wie das aussieht im Browser ist für die Wahl des richtigen Tags irrelevant.
Das Aussehen machst Du strikt getrennt vom Inhalt und der Semantik mit CSS. Klar musst Du dann aus den Listenpunkten Inline-Elemente machen oder sie floaten. Aber so ist das auch gedacht. HTML ist schließlich nicht zur Darstellung da.