What I am looking for is a CSS equivalent of jQuery's $(div).css({height:screen.height/10})

I have heard of CSS media queries and I like them, but I don't know of anything that could even do something even close to that. I know how to use min-height query:

@media (min-height: ... /* some height */){

    div{

        height: ... /* 'some height' divided by ten */

    }

}

but it only gets 10% height of the browser window (not what I'm looking for!).

And I can't just simply use height: 10% because the div is nested in another element that has a set height in pixels.

I also can't use height: 10vh because the viewport's height is not at all the device screen's height (tested in Chrome and IE; If you want proof, resize the window. You'll notice that the height changes as the window's height changes)

NOTE:

I am asking that the div be 10% of the device screen, meaning that if the computer's monitor (the device screen) has a resolution of 1280px by 800px, then the div should be 10% of 800px, which is 80px. Also, if the window resizes, the div's height should not change, because even though the window is resizing, it is impossible to resize the physical computer monitor or phone screen