Liste nur das oberste bzw. unterste Element ansprechen

[Nico]

Moin,

ich habe eine Liste als Navigation, die einen Hintergrund per CSS zugeteilt bekommen hat.

Nun sieht die gesamte Navigation wie ein rechteck aus, ich würde gerne nun nur den obersten Listenpunkt der Navigation und den letzten ansprechen um diese abzurunden.

Einfach den beiden Elementen eine eigene klasse zu geben und es darüber zu steuern geht leider nicht, da die Navigation dynamisch erstellt wird und nicht immer gleich ist.

Hat wer ne Idee?

[ChrisB]

Hi,

Hat wer ne Idee?

http://wiki.selfhtml.org/wiki/CSS/Selektoren/Pseudoklasse/strukturelle_Pseudoklasse/first-child
http://wiki.selfhtml.org/wiki/CSS/Selektoren/Pseudoklasse/strukturelle_Pseudoklasse/last-child

MfG ChrisB

[Gunnar Bittersmann]

@@Nico:

nuqneH

Einfach den beiden Elementen eine eigene klasse zu geben und es darüber zu steuern geht leider nicht, da die Navigation dynamisch erstellt wird und nicht immer gleich ist.

Doch, das geht mit etwas Logik durchaus.

Aber natürlich sind solche Klassen sinnlos, denn genau dafür gibt es Pseudoklassen, wie ChrisB schon sagte.

Qapla'

[Gunther]

@@Gunnar:

nuqneH

Einfach den beiden Elementen eine eigene klasse zu geben und es darüber zu steuern geht leider nicht, da die Navigation dynamisch erstellt wird und nicht immer gleich ist.

Doch, das geht mit etwas Logik durchaus.

Aber natürlich sind solche Klassen sinnlos, denn genau dafür gibt es Pseudoklassen, wie ChrisB schon sagte.

Hängt aber auch von den zu unterstützenden Browsern ab. Falls man u.a. auch den IE 8 noch unterstützen möchte, muss man entweder auf eine Javascript Lösung wie bspw. selectivizr zurückgreifen, oder eben doch dem Element eine entsprechende Klasse verpassen.

Gruß Gunther

[Gunnar Bittersmann]

@@Gunther:

nuqneH

Hängt aber auch von den zu unterstützenden Browsern ab.

Hängt ganz allgemein auch davon ab, was man unter „Unterstützung“ versteht. Pixelgenau in allen Browsern? Oder progressive enhancement! Do websites need to look exactly the same in every browser?

Man muss nur den Stakeholdern klarmachen, dass die Welt nicht zusammenbricht, wenn im IE 8 das erste/letzte Element so aussieht wie die anderen auch und nicht speziell gestylt wie in modernen Browsern.

Falls man u.a. auch den IE 8 noch unterstützen möchte, muss man entweder auf eine Javascript Lösung wie bspw. selectivizr zurückgreifen, oder eben doch dem Element eine entsprechende Klasse verpassen.

Nein, muss man hier im speziellen Fall nicht, weil IE 8 sowieso keine runden Ecken macht.

Qapla'

[Gunther]

@@Gunnar:

nuqneH

Hängt aber auch von den zu unterstützenden Browsern ab.

Hängt ganz allgemein auch davon ab, was man unter „Unterstützung“ versteht. Pixelgenau in allen Browsern? Oder progressive enhancement!

Man muss nur den Stakeholdern klarmachen, dass die Welt nicht zusammenbricht, wenn im IE 8 das erste/letzte Element so aussieht wie die anderen auch und nicht speziell gestylt wie in modernen Browsern.

Das ist natürlich eine Option ...!

Falls man u.a. auch den IE 8 noch unterstützen möchte, muss man entweder auf eine Javascript Lösung wie bspw. selectivizr zurückgreifen, oder eben doch dem Element eine entsprechende Klasse verpassen.

Nein, muss man hier im speziellen Fall nicht, weil IE 8 sowieso keine runden Ecken macht.

Doch, per 'background-image' bspw.! :-P
Persönlich würde ich aber auch eher zu der anderen Option tendieren.

Aber in diesem Fall hier, ging es ja auch hauptsächlich darum, den OP darauf hinzuweisen, dass die vorgeschlagenen Pseudoklassen ggf. nicht von allen Browsern verstanden werden.

Gruß Gunther

[Gunnar Bittersmann]

@@Gunther:

nuqneH

Man muss nur den Stakeholdern klarmachen, dass die Welt nicht zusammenbricht, wenn im IE 8 das erste/letzte Element so aussieht wie die anderen auch und nicht speziell gestylt wie in modernen Browsern.

Das ist natürlich eine Option ...!

Durchaus. Das lässt sich ja durchaus über Kosten regeln. Website (die auch im IE 8 bestens *funktioniert*) kostet x. Website, die im IE 8 genauso *aussieht*, kostet x + y.

Egal, ob x in Euro oder in-house in Arbeitsstunden gerechnet wird. Der Auftraggeber/Projektmanager hat die Wahl, ob es ihm wirklich wert ist, für Kosmetik in alten Browsern zusätzlich noch y draufzulegen.

Qapla'

[Gunther]

@@Gunnar:

nuqneH

Egal, ob x in Euro oder in-house in Arbeitsstunden gerechnet wird. Der Auftraggeber/Projektmanager hat die Wahl, ob es ihm wirklich wert ist, für Kosmetik in alten Browsern zusätzlich noch y draufzulegen.

Genau!
Und meistens endet "die Liebe zu alten Browsern" dann sehr schnell ...! ;-)

Gruß Gunther

[Gunnar Bittersmann]

@@Gunther:

nuqneH

Falls man u.a. auch den IE 8 noch unterstützen möchte […]

Nur der Vollständigkeit halber: IE 8 (und auch schon IE 7) unterstützt :first-child (was ja schon in CSS 2 spezifiziert wurde).

:last-child (kam in CSS 3 dazu) erst ab IE 9.

Qapla'