5 возможностей LESS, о которых вы могли не знать

Ваш пример с переменными вполне применим на практике. Если с переменными работать неудобно, то можно сделать миксин, который будет принимать в качестве параметра путь к изображению и возвращать его размеры с учетом коэффициента:

.image-size(@image, @ratio: 1) {
    width: image-width(@image) * @ratio;
    height: image-height(@image) * @ratio;
}

Затем этот миксин можно использовать, например, так:

.logo {
    .image-size("../images/logo.png");

    @media screen and (max-width: 767px) {
        .image-size("../images/logo.png", 0.5);
    }
}

5 возможностей LESS, о которых вы могли не знать

Получив размеры изображения, дальше мы можем делать с ними все что угодно – например, пропорционально уменьшить для мобильных устройств. Также эти функции весьма полезны, если мы вставляем картинку как фоновое изображение. В таком случае нам обязательно нужно задать размеры.

Как я вспоминал школьный курс геометрии

Согласен, за этим способом будущее. Жаль, что IE поддерживает фильтры, только начиная с версии Edge 13.

Как я вспоминал школьный курс геометрии

Вы понимаете как работают CSS-препроцессоры? Все вычисления происходят на этапе компиляции. На размер CSS-кода это не влияет. И уж тем более любая картинка будет занимать гораздо больше "гигабайт", не говоря уже о том, что делать тени с помощью изображения, мягко говоря, не круто.

Как я вспоминал школьный курс геометрии

А как бы вы решили эту задачу, картинкой?

Как я вспоминал школьный курс геометрии

Если бы треугольник был равносторонним, то его высота была бы примерно 20 пикселей, по макету же высота составляет 10 пикселей. Поменяйте вот тут значение @arrow-height на @arrow-width * sin(60deg) и получите равносторонний треугольник.

Расстановка полей и отступов в CSS

Спасибо за дополнения. Можете про первый пункт подробнее объяснить? Желательно с примерами вызова миксина.

Расстановка полей и отступов в CSS

С точки зрения корректности перевода вы правы. Но термин «отбивка» слишком типографский, я ни разу не слышал чтобы его употребляли верстальщики. В основном говорят «поля», «отступы», иногда «внешние поля».
Термин «сложение полей» не подходит, поскольку поля как раз не складываются, а берется максимальное значение. Тогда уж «наложение полей».

Расстановка полей и отступов в CSS

Согласен. Я просто привел еще один вариант селектора.

Расстановка полей и отступов в CSS

Дело привычки. У меня уже не вытекают. :)

Расстановка полей и отступов в CSS

Думаю в данном случае специфичность это хорошо, поскольку позволяет задавать разные отступы между разными элементами.

Расстановка полей и отступов в CSS

Можно и так. )
Или вот еще вариант:

.news__list-item + .news__list-item {
    margin-top: 18px;
}

Все способы вертикального выравнивания в CSS

Если имеется в виду проблема с отступами между инлайн блоков, то вот хорошая статья на эту тему:
https://css-tricks.com/fighting-the-space-between-inline-block-elements/

Все способы вертикального выравнивания в CSS

Упрощение сделано для того, чтобы объяснить читателю как работает свойство vertical-align. В дальнейшем рассматриваются различные варианты задачи, в том числе, когда высоты обоих блоков неизвестны.

Все способы вертикального выравнивания в CSS

Не знал об этом, спасибо за ваш комментарий.

Все способы вертикального выравнивания в CSS

Если не нужна поддержка IE 9, то конечно лучше использовать flexbox.

Все способы вертикального выравнивания в CSS

Да, там. )
Вот обновленный пример, где проблема с 2px решена:
http://jsfiddle.net/c1bgfffq/30/

Все способы вертикального выравнивания в CSS

Проверил пример из статьи — отступы одинаковые. Но вообще я встречал проблему, о который вы говорите. Обычно она решается с помощью font-size: 0.

Microsoft признает провал Windows Vista

спасибо за совет, купил уже

Microsoft признает провал Windows Vista

Я не понимаю как можно хвалить Висту, если из всех новшеств в ней это интерфейс Aero, полностью содранный с Mac OS? Объясните мне, пожалуйста, за что я должен отдать свои 4000 руб., за идеи скопированные у Apple?