umgekehrtes Noscript

[Gunnar Bittersmann]

Hello out there!

Was soll das ' ' da? Für Abstände ist doch CSS zuständig (margin, padding).

Dann müsste ich in diesem Fall diesen einzelnen Text-Teilen
ja noch ingendweloche Klassen usw. zuteilen.

Nochmal genauer hingeschaut: Nein, was du eigentlich willst, ist eine verschachtelte Liste:

      <ul id="Navigation">  
        <li id="logo"><a href="/_Test2/"><img src="/_Test2/bilder/logo-navigation.gif" width="220" height="162" alt="zur Startseite" title="zur Startseite" /></a>  
          <ul>  
            <li><a href="/_Test2/">Startseite</a></li>  
            <li><a href="/_Test2/warenkorb.php">Warenkorb</a></li>  
          </ul>  
        </li>  
        <li>Suche  
          <ul>  
            <li>  
              <form method="post" action="cgi-bin/webindex/websearch.cgi">  
                <div>  
                  <input type="hidden" name="sort" value="2" />  
                  <input type="hidden" name="combination" value="AND" />  
                  <input class="text" name="searchwords" type="text" /><br />  
                  <input id="absenden" type="submit" name="send" value="Suchen" />  
                </div>  
              </form>  
            </li>  
            <li><a href="/_Test2/erweiterte-suche.php">Erweiterte Suche</a></li>  
          </ul>  
        </li>  
  
        <li>Shop  
          <ul>  
            <li><a href="/_Test2/listen/modelle-science-fiction-fantasy-a.php">SciFi + Fantasy Modelle</a></li>  
            <li><a href="/_Test2/listen/modelle-action-horror-a.php">Action + Horror Modelle</a></li>  
            <li><a href="/_Test2/listen/modelle-erotik-a.php">Erotik Modelle</a></li>  
            <li><a href="/_Test2/listen/schwerter-dolche.php">Schwerter + Dolche</a></li>  
            <li><a href="/_Test2/listen/zubehoer.php">Zubehör</a></li>  
          </ul>  
        </li>  
  
        <li>Service  
          <ul>  
            <li><a href="/_Test2/geschenkgutscheine.php">Geschenkgutscheine</a></li>  
            <li><a href="/_Test2/bemal-service.php">Bemal-Service</a></li>  
            <li><a href="/_Test2/space-detektiv.php">Space-Detektiv</a></li>  
          </ul>  
        </li>  
  
        <li>Dialog  
          <ul>  
            <li><a href="/_Test2/nr/kontakt-email.php">Kontakt + E-Mail</a></li>  
            <li><a href="/_Test2/nr/rueckruf-service.php">Rückruf-Service</a></li>  
            <li><a href="/_Test2/nr/newsletter.php">Newsletter</a></li>  
            <li><a href="/_Test2/rss-feed.php">RSS-Feed</a></li>  
            <li><a href="/_Test2/impressum.php">Impressum</a></li>  
          </ul>  
        </li>  
  
        <li>Hilfe  
          <ul>  
            <li><a href="/_Test2/bestellvorgang.php">Bestellvorgang</a></li>  
            <li><a href="/_Test2/versandkosten.php">Versandkosten</a></li>  
            <li><a href="/_Test2/faq.php">F.A.Q.</a></li>  
            <li><a href="/_Test2/agb.php">AGB</a></li>  
          </ul>  
        </li>  
  
        <li>Extras  
          <ul>  
            <li class="aktiv">Bildschirmschoner</li>  
            <li><a href="/_Test2/werbung.php">Werbung</a></li>  
            <li><a href="/_Test2/spiel/spiel.php">Spiel</a></li>  
          </ul>  
        </li>  
      </ul>

Die Klasse 'trenner' ist dann auch nicht nötig.

Das würde den Code dann immer weiter aufblähen.

Nö. ;-)

Warum verwendest du U+0399 greek capital letter iota als Trennzeichen, und nicht '|'?

Weil das anscheinend ein anderes Zeichen ist.

Ja, das eine ist ein Buchstabe, das andere ein Trennzeichen. Welches willst du? ;-)

Und ich finde das kurze Trennzeichen schöner.

CSS!!!11einself

foo <span class="trennzeichen">|</span> bar

.trennzeichen {  
  font-size: 0.8em;  
  padding: 1em;  
  position: relative;  
  top: -0.2em;  
}

Und schon bist du auch die '  ' los.

(Die Klasse kannst du auch gerne 'trenner' nennen, da du die anderweitig ja nicht mehr brauchst. ;-))

Noch schickeres Markup wäre natürlich foo <hr /> bar (dass 'h' für 'horizontal' steht, soll nicht stören; in XHTML 2 heißt das Ding dann 'separator').

hr {  
  display: inline;  
  border: 0 none;  
  margin: 0;  
}  
hr::before {  
  content: "\A0 \A0 |\A0 \A0";  
}

Aber zum einen kennt IE das Pseudoelement '::before' nicht, zum anderen macht auch Firefox trotz 'display: inline' einen Zeilenumbruch – aus mir noch unergründlichen Gründen. Ein Bug?

See ya up the road,
Gunnar