Funkcja calc
Funkcja calc pozwala na wykonywanie
obliczeń wartości właściwości CSS. Funkcja
jako parametr przyjmuje wyrażenie matematyczne,
którego wynik obliczenia można użyć jako wartość właściwości CSS.
Wyrażenie może zawierać operatory
+, -, *, /.
Składnia
selektor {
właściwość: calc(wyrażenie);
}
Przykład
Zróbmy tak, aby szerokość bloku była
równa 100% szerokości rodzica, minus
50px:
<div id="parent">
<div id="child"></div>
</div>
#child {
width: calc(100% - 50px);
height: 100px;
margin: 0 auto;
border: 1px solid red;
}
#parent {
border: 1px solid green;
}
: