How to set the height which depends on window height using css calc()

Question

This is my css - see the height property

header{
   position:fixed;
   height:50px
}
.block{
   height: calc(100vh - (50px));
}

I am getting the result on website

.

.block{
   height: calc(50vh);
}

Answer 1

First off, I don't think you need the brackets around the 50px,
CSS is capable of doing the math without those.

More to the point:
calc is a rather new technology, still in the experimental phase.
So not every browser will support it.

You might want to use the browser prefixes (-moz- and -webkit-) to continue your experiment.

Also, you should probably take a look at this page:
https://developer.mozilla.org/en-US/docs/Web/CSS/calc