Hacker News new | ask | show | jobs
by amelius 2451 days ago
CSS is just broken. I want to use general expressions like

    height = a.height + b.height - 2*c.height
1 comments

You can!

  :root {
    --header-height: 5em;
    --container-height: 25em;
    --other-height: 2.5em;
  }

  div {
    height: calc(var(--container-height) - var(--header-height) + (var(--other-height)*2));
  }
But this example uses static sizes, unlike the sticky footer problem of the article (where e.g. the window can be resized by the user).

Can CSS calc() be used with dynamic widths or heights of other elements?