CSS - calc()
Opublikowano czw 02 kwietnia 2020 w css • 1 min read
Właściwość calc()
jest funkcją której mogą być przypisane wartości:
length
, angles
, time
, number
, integer
.
Jest szczególnie przydatna w obliczaniu wartości relatywnych - ponieważ:
pozwala na wykonywanie matematycznych wyrażeń dodawania, odejmowania, mnożenia, dzielenia (+
,-
,*
,/
)i wykorzystuje wynik jako wartość CSS, która przyjmuje wcześniej wspomniane wartości.
Przykładowe zastosowanie
50% rodzica dzielone przez 3
el {
width: calc(100% - 50% / 3);
}
10% rodzica + dodatkowe 10px
.el {
margin-left: calc(10% + 10px);
}
Źródło i polecane linki:
https://tympanus.net/codrops/css_reference/calc/
Pełen spis referencji CSS
https://www.w3schools.com/cssref/default.asp