CSS: полное руководство по функции calc()

[vanxant]

Вот это я понимаю, у кого-то словесное недержание. Рассказывать про одну очевидную функцию в статье размером 30 килобайт (без учёта картинок)!

[3263927]

офигенная статья спасибо! очень полезно, как раз возникли вопросы по применению этого свойства для динамического задания размера текста для кроссбраузерной вёрстки

[Iamman]

Добавил бы ещё, что если хочется подставить вычисленное значение sass-переменной в calc, то можно воспользоваться интерполяцией. Это может быть удобно в связке с css-vars:

$gutter: 10px;

.block {
  --scale: 2;
  margin: calc(var(--scale) * #{gutter});  // calc(var(--scale) * 10px)
}

[Maxor1k]

Вот елки, я про нее не знал) И думал — какой scss крутой и продуманный, что можно делать расчеты.

[Bladerunnerz]

Полезные лайфхаки и хороший перевод. Спасибо! Утащил в закладки)

[SuhushinAS]

Сейчас активно, но неявно используем для адаптивного текста: Пример

[BlackStar1991]

Что такое calcLeft и как оно работает ? Вот на этом примере - https://codepen.io/the-gureev/pen/PoRgXGp

[mayorovp]

Просто пользовательская функция, объявленная средствами SCSS, и не имеющая никакого отношения к CSS вообще и этому посту в частности.

[BlackStar1991]

ок, признаю, был не прав. Не увидел вначали дикларации.