calc() : En la versión 4 de CSS aparece una herrramienta que facilita muchas cosas y le dá a los diseñadores la potencia de otorgar un valor a una característica dependiendo del valor de otras características.
Especialmente prestar atención all usar esta funcion. Los paréntesis van pegados a calc y los signos de las operaciones van separados mediante espacio entre los valores.

Ejemplo

See the Pen calc() by Bernardo Martin (@bermartinv) on CodePen.

attr() : Los atributos que pueden aparecer dentro del código CSS pueden ser : string(el contenido del elemento content), color, url, integer, number, length, angle, time, frequency, %.