newbee: Wieso verrutscht der oberste Button meiner Navigationsleiste

Hallo,
ich habe gerade eine Navigationsleiste mit mehreren untereinander stehenden Buttons erstellt. Nun rutscht der oberste immer ein paar Pixel nach rechts.
Ich weiß genau, ich habe über dieses Problem schonmal was gelesen, aber hier auf der Seite finde ich es schon mal nicht mehr wieder. Es wäre super, wenn mir jemand helfen könnte.

Das ist der CSS-Code:

ul.navi {background-color: #FFFF00;
         font-weight: bold;
         list-style-type: none;
         padding: 2px;
         margin: 2px;
         width: 150px;
    }

Außerdem ist der Bereich links angesiedelt:

div.navi {float: left; }

Gruß, Sandra

  1. Grüße,
    dürfte ich die Liste selbst sehen, danke.
    MFG
    bleicher

    --
    __________________________-
    Die versprechen ernsthaft werbefreien hosting?
  2. Hi,

    ich habe gerade eine Navigationsleiste mit mehreren untereinander stehenden Buttons erstellt. Nun rutscht der oberste immer ein paar Pixel nach rechts.

    da Du uns den relevanten HTML-Code vorenthälst (sowie evtl. weiteres CSS), kann ich nur raten: Whitespace (und evtl. der IE).

    freundliche Grüße
    Ingo

  3. Hi,
    danke für die schnellen Antworten. Klar, der HTML-Code wäre sinnvoll gewesen...=:-0
    Ich habe es mit <pre> probiert - in der Tat ist es jetzt nicht mehr verschoben, stattdessen erscheint jetzt ein Listenpunkt über der Navigationsleiste, und das ganze ist entsprechend nach unten verschoben.

    So sieht die Liste jetzt aus:

    <p></p>

    <pre>
    <div class="navi">
    <li>
    <ul class="navi">Home</ul>
    <ul class="navi"><a href="aboutai.html">&Uuml;ber xx</a></ul>
    <ul class="navi">Downloads</ul>
    <ul class="navi">Links</ul>
    </li>
    </pre>
    </div>

    <p>...

    Grüße, Sandra

    1. Ich habe es mit <pre> probiert - in der Tat ist es jetzt nicht mehr verschoben, stattdessen erscheint jetzt ein Listenpunkt über der Navigationsleiste, und das ganze ist entsprechend nach unten verschoben.

      Raten löst nicht immer Probleme. Einfach irgendwelchen HTML-Code hinzufügen, um eine bestimmte Darstellung zu erreichen ist ebenfalls keine gute Idee.

      <p></p>

      Das gehört nicht zur Liste, ein leerer Absatz ist allerdings sinnfrei, kommt da noch was rein?

      <pre>
      <div class="navi">
      <li>
      <ul class="navi">Home</ul>
      <ul class="navi"><a href="aboutai.html">&Uuml;ber xx</a></ul>
      <ul class="navi">Downloads</ul>
      <ul class="navi">Links</ul>
      </li>
      </pre>
      </div>

      Zwei Fehler: Du hast ul und li vertauscht (ul kommt außenrum, li innen), außerdem schließt du pre, bevor du div schließt, obwohl div zuletzt geöffnet wurde. pre und div würde ich übrigens beide weglassen, dem ul (dem nach der Korrektur) die Klasse geben und sie bei den Listenpunkten entfernen.

      Beim nächsten Mal bitte den Validator bemühen!

      --
      Reden ist Silber, Schweigen ist Gold, meine Ausführungen sind Platin.
      Self-Code: sh:( ch:? rl:( br:> n4:( ie:{ mo:) va:) de:> zu:} fl:| ss:| ls:~ js:|
      1. Große Güte!! Ich fürchte, ich sitze schon zu lange an diesem Dokument... Das kommt wohl davon, wenn man denkt, manche Dinge würde man im Schlaf beherrschen...

        Sorry so much for wasting your time...natürlich sieht die Leiste jetzt so aus wie sie aussehen sollte...

        Demütiger Gruß ;(
        Sandra