Marża na każdy element z wyjątkiem ostatniego

Question

Mam 2 linie CSS do ustawienia marginesu na każdym elemencie z wyjątkiem ostatniego. Czy istnieje sposób na połączenie go w 1 linię?

To co mam obecnie (pracy):

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

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

Próbowałem zmieniając go do:

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

Ale to nie działa? Każdy pomysł, dlaczego?

AKTUALIZACJA Mam tylko pięć zdjęć. Moją drugą opcją byłoby posiadanie marginesów tylko na pierwszych czterech.

Answer 1

Masz mały błąd

Zmiana:

.work img:not(:last) 

do

.work:not(:last-child) 

Sprawdź Fiddle Here.

Answer 2

Spróbuj tego:

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

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

lub

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

lub rozwiązanie jQuery:

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

Pamiętaj, potrzeba przeglądarka mieć wsparcie dla selektora jeśli stosuje czystego CSS.

Zobacz to na odniesienie: http://caniuse.com/#search=%3Alast-child

Answer 3

Jeśli potrzebujesz pełnego wsparcia przeglądarki, chciałbym zaproponować korzystania niektóre javascript lub dodanie klasę .last ostatniego img. W przeciwnym razie można po prostu zrobić:

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