Cannot make work Calc() css property in mozilla firefox

Question

I have a wrapper with a class that sets it's height based on a calc() wich is working smoothly on all browsers except in firefox. This is the snippet

  width: 340px;

  float: left;
  overflow:hidden;
  overflow-y:scroll;
  scrollbar-width: thin;

  height: calc(100% - 120px);

Any idea of what's happening or what I'm missing out?

Does this answer to your question? https://stackoverflow.com/questions/43029822/calc-not-working-in-firefox — xKobalt, Mar 04 '20 at 12:27

score 1 · Answer 1 · answered Mar 04 '20 at 12:27

1

try with vh

height: calc(100vh - 120px);

answered Mar 04 '20 at 12:27

Lalji Tadhani

Totally fixed the problem. But what's the reason why 100% isn't working? I'm using percentages also on more parts of my CSS and everything works – Javier Ortega Mar 04 '20 at 12:30
parent height problem – Lalji Tadhani Mar 04 '20 at 12:30

1 Answers1