Frage zu Auszeichnung von Navigationsmenü als Liste

[Gunnar Bittersmann]

Hello out there!

Die 4 Listenelemente sollen immer die gesamte feste Breite (z.B. 500px) ausfüllen und der Abstand zwischen den Listenelementen soll automatisch gemacht werden, […] wie bei einer Tabelle.
[…] fällt euch eine Lösung ein?

Sogar zwei:

(1) Die hast du schon angedeutet: „wie bei einer Tabelle.“

ul {display: table}  
li {display: table-cell}

Der Darstellungsalgorithmus der Browser macht den Zwischenraum nicht unbedingt gleich.

(2) Du benutzt den Blocksatz:

ul {text-align: justify}  
li {display: inline}

Da Blocksatz die letzte Zeile eines Absatzes nicht beeinflusst, muss das Menü also in der vorletzten stehen und danach noch eine Zeile mit unsichtbarem Inhalt kommen:

li:last-child::after {content: " \A0\A0\A0\A0\A0\A0\A0"}

Die Anzahl der geschützten Leerzeichen richtet sich nach der Breite der Box.

IEs sind mit beiden Varianten überfordert, aber die zweite ließe sich ja auch mit HTML zusammenschummeln:

<ul>  
  <li>foo</li>  
  <li>bar</li>  
  <li>baz</li>  
  <!--[if lt IE 7]> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<![endif]-->  
</ul>

zweites Problem: Auszeichnung von Zitaten.
Was haltet ihr von der Lösung:
mit CSS qoutes auf leer also "" setzen, manuelles Einfügen der Anführungszeichen

Warum soll man modernen Browsern die Möglichkeit nehmen, die entsprechenden Anführungszeichen zu setzen – auch abhängig von der Sprache (lang-Attribut) und Verschachtelungstiefe?

Damit in IEs auch Anführungszeichen stehen:

<q><!--[if lt IE 7]>&quot;<![endif]-->lorem ipsum<!--[if lt IE 7]>&quot;<![endif]--></q>

See ya up the road,
Gunnar