Fungsi calc
Fungsi calc memungkinkan untuk melakukan
perhitungan nilai properti CSS. Fungsi
ini menerima ekspresi matematika sebagai parameter,
yang hasil perhitungannya
dapat digunakan sebagai nilai properti CSS.
Ekspresi dapat mencakup operator
+, -, *, /.
Sintaks
selektor {
properti: calc(ekspresi);
}
Contoh
Mari kita buat lebar blok menjadi
sama dengan 100% dari lebar induk, dikurangi
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;
}
: