Как выбрать всех детей элемента, кроме последнего?

Сделаем проще:

Вы можете применить ваш стиль ко всем элементам div и переопределить последний с помощью :last-child.

Например, в CSS это будет выглядеть так:

.yourclass {
    border: 1px solid blue;
}
.yourclass:last-child {
    border: 0;
}

Или в SCSS:

.yourclass {
    border: 1px solid rgba(255, 255, 255, 1);
    &:last-child {
        border: 0;
    }
}

• легко читать/запоминать
• быстро выполняется
• совместимо с браузерами (IE9+ так как это все еще CSS3)

Правка: Я писал это в то время, когда :not не поддерживался всеми браузерами. Сегодня я был бы более осторожным и использовал бы это решение в некоторых ситуациях, например, если нужно переопределить стандартное поведение.

В CSS3 существует селектор :not. Вы можете использовать :not() в сочетании с :last-child, чтобы выбрать всех детей, кроме последнего. Например, чтобы выбрать все элементы li в ol, кроме последнего li, используйте следующий код:

ol li:not(:last-child) {
  color: red;
}

Вот пример HTML-кода:

<ol>
  <li>
    foo
  </li>
  <li>
    foo
  </li>
  <li>
    foo
  </li>
</ol>

В этом примере все элементы li, кроме последнего, будут окрашены в красный цвет.

Когда выйдет IE9, это упростит задачу. Тем не менее, часто можно изменить проблему так, чтобы использовать :first-child и стилизовать противоположную сторону элемента (IE7 и выше).

Если вы используете его внутри вложенности родителя, то самый простой способ — это:

&:not(:last-child){
  ....
}

Пример:

.row {  // родитель
  ...
  ...
  ...
  &:not(:last-child){
    ....
  }
}

Таким образом, вы можете применять стили ко всем дочерним элементам, кроме последнего.

Чтобы выбрать элементы, кроме последнего, используйте следующий CSS код:

<style>
ul li:not(:last-child) { color: #a94442; }  
</style>

В этом примере все элементы списка li, кроме последнего, будут окрашены в цвет #a94442. Это достигается с помощью псевдокласса :not(:last-child), который исключает последний элемент li из стилей.