calc(): когато ширината е процент минус отстояние

Полезно е да знаеш

calc() изчислява стойност в CSS израз. Примерът width: calc(100% - 2rem); означава ширина, която е с 2rem по-малка от съответната процентна основа. Функцията е полезна, когато една част от размера е относителна, а друга следва различна мерна единица. [1]

Около операторите плюс и минус се оставят интервали: calc(100% - 2rem), а не calc(100%-2rem). Типовете и единиците трябва да са допустими за израза и за свойството. Това не е произволен JavaScript израз, поставен в таблица със стилове. [1]

Ако блокът пак прелива, провери padding, border и box-sizing. Изваждането на отстояние от width не отменя останалите правила на модела на кутията. За обикновено разстояние между колони gap често изразява намерението по-пряко, докато calc е подходящо за действителна зависимост между размери.