Solution 1 :

try with vh

height: calc(100vh - 120px);

Problem :

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;
  scrollbar-width: thin;

  height: calc(100% - 120px);

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


Comment posted by…

Does this answer to your question?

Comment posted by Javier Ortega

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

Comment posted by Lalji Tadhani

parent height problem