height = a.height + b.height - 2*c.height
:root { --header-height: 5em; --container-height: 25em; --other-height: 2.5em; } div { height: calc(var(--container-height) - var(--header-height) + (var(--other-height)*2)); }
Can CSS calc() be used with dynamic widths or heights of other elements?