nicht angemeldet
horizontale Liste (Menü) als Blocksatz
0 0 1 
Gunnar Bittersmann
horizontale Liste (Menü) als Blocksatz
Der MartinHallo Forum,
ich habe bereits goolge und die Suche befragt, Ergebnisse gefunden aber mein Problem trotzdem nicht lösen können.
Ich will eine Navigation über die Breite von 860px als Blocksatz darstellen (d.h. der freie Platz wird gleichmäßig in allen Zwischenräumen der Liste verteilt).
so sieht mein CSS aus:
#navibar ul{
margin:0;
padding:0;
width:860px;
display:block;
text-align:justify; // mit 'center' wird es richtigerweise zentriert
}
#navibar li{
list-style-type:none;
display:inline;
}
Wie oben erwähnt, funktioniert "center" wie erwartet. "justify" bewirkt allerdings gar nichts. Das Menü klebt links. Warum?
danke, andi
-
Hi,
Wie oben erwähnt, funktioniert "center" wie erwartet. "justify" bewirkt allerdings gar nichts. Das Menü klebt links. Warum?
Weil sich justify immer nur bei mehreren Zeilen auswirkt, und dabei nicht auf die letzte.
MfG ChrisB
--
RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?-
hi
Weil sich justify immer nur bei mehreren Zeilen auswirkt, und dabei nicht auf die letzte.
ah, ok. In einem alten thread hatte ich noch das hier gefunden:
ul { list-style: none; margin: 0; padding: 0; text-align-last: justify; text-align: justify; }das
text-align-last: justify;bringt mich aber auch nicht weiter. Wie komme ich denn zum gewünschten erfolg? :)-
@@ad:
nuqneH
das
text-align-last: justify;bringt mich aber auch nicht weiter.Doch, im IE schon. Der hat es seit geraumer Zeit schon implementiert. Keine Ahnung, warum die anderen Browser da nicht nachziehen.
Wie komme ich denn zum gewünschten erfolg? :)
Indem du Inhalt einfügst, der eine neue Zeile erzwingt:
ul::after { content: "\A0"; display: inline-block; height: 0; width: 100%; }Qapla'
--
Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
(Mark Twain)-
hi
im IE schon. Der hat es seit geraumer Zeit schon implementiert. Keine Ahnung, warum die anderen Browser da nicht nachziehen.
aha. mal ws ganz Neues :-)
Wie komme ich denn zum gewünschten erfolg? :)
Indem du Inhalt einfügst, der eine neue Zeile erzwingt:
ah cool. Vielen Dank!!!
-
Jetzt habe ich doch noch eine Frage. Eigentlich hatte alles soweit so gut geklappt. Ein Menüpunkt heisst "Lorem + ipsum". Damit das nicht auseinandergerissen wird, habe ich "Lorem + ipsum" notiert. Im FF3.6 kein Problem.
Just in diesem Augenblick habe ich zum FF4 geupdatet. Nun wird (trotz des ) der Menüeintrag total zerrissen:
Lorem + ipsumFF4 bug?
-
@@ad:
nuqneH
Just in diesem Augenblick habe ich zum FF4 geupdatet. Nun wird (trotz des ) der Menüeintrag total zerrissen:
Lorem + ipsumFF4 bug?
Unterschiedliche Behandlung von NBSP bei Blocksatz. Da bin ich auch schonmal drauf reingefallen.
li { display: inline-block }does the trick. Dann kannst du auch auf NBSP verzichten und normale Leerzeichen verwenden. Sieht in aktuellen Chrome, Firefox, Opera und Safari gut aus; IE hab ich gerade nicht zur Hand.Qapla'
--
Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
(Mark Twain)-
@@Gunnar Bittersmann:
nuqneH
li { display: inline-block }does the trick. Dann kannst du auch auf NBSP verzichten und normale Leerzeichen verwenden. Sieht in aktuellen Chrome, Firefox, Opera und Safari gut aus; IE hab ich gerade nicht zur Hand.Im 8er und 9er sieht’s gut aus. Der 7er ist widerspenstig, da ist mir nichts besseres eingefallen als doch seine Art des Umgangs mit NBSP und Blocksatz auszunutzen (d.h. doch NBSP zu verwenden):
ul { list-style: none; margin-left: 0; padding: 0; text-align: justify; text-align-last: justify; } ul::after { content: "\A0"; display: inline-block; height: 0; width: 100%; } li, li:lang(zxx) { display: inline-block; padding: 0; } *+html li { display: inline; }Der Selektor 'li, li:lang(zxx)' macht diese Regel für IE 7 unsichtbar (weil er :lang() nicht kennt). Ansonsten schlugen alle meine Versuche fehl, ihn davon zu überzeugen, einmal gesetztes 'display: inline-block' mit 'display: inline' zu überschreiben. Gibt’s da ’nen Trick?
Qapla'
--
Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
(Mark Twain)-
Om nah hoo pez nyeetz, Gunnar Bittersmann!
Ansonsten schlugen alle meine Versuche fehl, ihn davon zu überzeugen, einmal gesetztes 'display: inline-block' mit 'display: inline' zu überschreiben. Gibt’s da ’nen Trick?
deine dritte Frage in diesem Forum? ;-)
Matthias
--
Wer ein Problem beschreiben kann, hat es schon halb gelöst. (Julian Huxley)
-
@@Matthias Apsel:
nuqneH
deine dritte Frage in diesem Forum? ;-)
Wieviele hat man denn hier frei? Hab ich jetzt schon alle aufgebraucht?
Qapla'
--
Gut sein ist edel. Andere lehren, gut zu sein, ist noch edler. Und einfacher.
(Mark Twain)-
Hallo Gunnar,
deine dritte Frage in diesem Forum? ;-)
Wieviele hat man denn hier frei? Hab ich jetzt schon alle aufgebraucht?jetzt ganz bestimmt. :-)
Ciao,
Martin--
"Dürfte ich Ihnen mal eine Frage stellen?" - "Sie haben es gerade getan."
Selfcode: fo:) ch:{ rl:| br:< n4:( ie:| mo:| va:) de:] zu:) fl:{ ss:) ls:µ js:(
-
-
-
Yerf!
Ansonsten schlugen alle meine Versuche fehl, ihn davon zu überzeugen, einmal gesetztes 'display: inline-block' mit 'display: inline' zu überschreiben. Gibt’s da ’nen Trick?
Ich denk mal eher nicht. Das nachträgliche setzen von display:inline war ja der Trick, damit display:inline-block im IE < 8 überhaupt funktioniert.
Die Unterstützung für diese Eigenschaft scheint da eher ein Unfall als gewollt zu sein...
Gruß,
Harlequin
--
RIP --- XHTML 2
nur die Besten sterben jung
-
-
-
-
-
-