esse est percipi
Das Weblog eines Grafikdesigners. Seit 2003.

Ähnliche Beiträge:

Tipp: Submit-Button im Upload-Formular erst anzeigen, wenn Dateien ausgewählt sind

Tipp: Dateigröße von PNG-24-Bildern reduzieren

Der perfekte Espresso (4) – Selbstgemachter Abklopfkasten für 8 Euro

JFritz-Anrufmonitor: iTunes bei Anruf automatisch stoppen

Mac OS X: E-Mail zu Erinnerungen hinzufügen

Kommentare:

Bei den Kommentaren handelt es sich um fremde Inhalte, die sich „esse est percipi“ nicht zueigen macht. Verantwortlich für den Inhalt eines Kommentars ist der jeweilige Verfasser.

Danke für den Tipp!
Das bekommt man auch allein mit CSS hin. Wenn das Menü mit einer Liste (ul) umgesetzt wird, kann man die Liste „als Tabelle“ anzeigen lassen.

Das sieht im Stylesheet so aus:
ul {width:100%; display:table}
li {list-style: none; display:table-cell}

Das sollte eigentlich reichen. Und es sieht dann z.B. wie hier aus: Meister-Design
Ich halte die Lösung mit CSS für flexibler und eleganter, weil da auf der Inhaltsseite nichts gemacht wird. Und mit den geschützten Leerzeichen bekommt man auch eine Leerzeile, die gegebenenfalls kaschiert werden muss.

Vielleicht kannst Du es noch als Alternative ergänzen.
Schöne Grüße!

Gute Sache,

als Alternative zu den vielen &enbsp; reicht es auch ein leeres span-tag im Abschluss zu setzen, das wie folgt formatiert ist:

CSS:
span {padding-left: 100%; display: inline-block;}

inline-block sorgt bei diversen Browsern (z.B. ältere Opera) dafür, dass das padding im Inline-Element verstanden wird.

So kann der einzeilige Blocksatz in mehreren Bereichen dynamisch eingesetzt werden wie zum Beispiel bei Thumbnails einer Bildergalerie.

Mal ehrlich, horizontale Menüs sind schon schick aber meistens – jedenfall bei uns – kann man nie sicher sein, ob und wieviele Punkte hinzukommen oder wegfallen. Und dann sind noch schöne bunte Grafiken rundrum und schon ist auch diese Lösung für'n A***h.

@Eugê:
Eine Liste als Tabelle anzeigen lassen? … … ugh.

@derAlex:
Ein Liste als Tabelle anzeigen lassen? Klar warum nicht? Im HTML steht weiterhin eine saubere Liste. Nur die Darstellung wird geändert. Warum sich dabei nicht die Darstellungsfunktionen einer Tabelle zu Nutze machen?
Allemal besser, als mit &nbsp; und &ensp; oder Dummy-<spans> zu tricksen. (Ist ja ein bisschen so wie mit Leerzeichen einrücken, oder am Ende jeder Zeile einen Zeilenumbruch einzusetzen… ;-)

@Michael: Touché. :)

Da war doch was … ab welchem IE kann man Listen als Tabellen anzeigen lassen? IE 8. Spaßbremse, ich weiß …

Da hat der Michael mir den Kommentar schon vorweggenommen: CSS ist ja gerade dafür da, dass man einzelne Seitenelemente sich so anzeigen lässt, wie man es will.

Und das ist dann wirklich das Totschlagargument gegen Tabellen-Layouts: „Du kannst dir auch semantisch korrektes HTML wie eine Tabelle anzeigen lassen; auf die gewünschte Breite skaliert und gleichmäßig aufgeteilt.“

Für mich eher ein Segen als ein Fluch. :-)

Der Artikel ist zwar schon ein Jahr alt, aber das Thema interessiert vielleicht doch noch jemanden.

Um das Markup mit überflüssigen Elementen nicht zu verschandeln, spricht man das letzte CSS Listenelement mit einem after-Pseudoelement an.

li:last-of-type::after { content: ''; padding-left: 100%; }

Das war's. Keine Veränderungen im HTML-Markup. Vor einem Jahr wäre das auch schon möglich gewesen, Pseudoelemente gibt es schon in CSS 2.1

Nachtrag: Damit es CrossBrowser-kombatibel ist, muss es

li:last-of-type::after { content: ''; padding-left: 100%; display: inline-block; }

lauten. Selbstverständlich gilt immer noch

li { list-style: none; display: inline; }

und

ul { list-style-type: none; text-align: justify; }

Alles schön und gut. Aber das funktioniert alles nicht im IE7. Der will Listenelemente einfach nicht justify darstellen gnaaaa… jemand dafür ne Lösung?

Kommentar schreiben:

RSS-Feed

Impressum/Datenschutz/AGB