Rand auf jedem Element mit Ausnahme der letzten

Question

Ich habe 2 Zeilen CSS für die Einstellung der Marge auf jedem Element mit Ausnahme der letzten. Gibt es eine Möglichkeit, es in 1 Linie zu kombinieren?

Dies ist, was ich zur Zeit habe (in Betrieb):

.work img { 
    margin-right: 10px; 
} 

.work img:last { 
    margin-right: 0px; 
} 

ich versuchte, es zu ändern:

.work img:not(:last) { 
    margin-right: 10px; 
} 

Aber es funktioniert nicht? Irgendeine Idee warum?

UPDATE Ich habe nur fünf Bilder. Meine andere Möglichkeit wäre, bei den ersten vier nur Margen zu haben.

Answer 1

Sie haben kleine Fehler

Wechsel:

.work img:not(:last) 

zu

.work:not(:last-child) 

prüfen Fiddle Here.

Answer 2

Try this:

.work img { 
    margin-right: 10px; 
} 

.work img:last-child { 
    margin-right: 0px; 
} 

oder

.work img:not(:last-child) { 
    margin-right: 10px; 
} 

oder jQuery Lösung:

jQuery('.work img:not(:last)').css({marginRight: 10); 

Denken Sie daran, Sie müssen Ihre Browser-Unterstützung für Wähler haben, wenn Sie reine CSS anwenden.

Sehen Sie diese als Referenz: http://caniuse.com/#search=%3Alast-child

Answer 3

Wenn Sie vollen Browser-Unterstützung benötigen, würde ich vorschlagen, einige Javascript, oder das Hinzufügen einer Klasse von .last am letzten img. Andernfalls könnten Sie einfach tun:

.work img:last-child { 
    margin: 0; 
}