проблема CSS при использовании различных типов единиц в том же правиле

Question

у меня есть это правило CSS для DIV, модального с высотой на основе вертикального размера окна браузера:

height: calc(100vh - 185px); 

Когда я использую его рядный (<div style="height: calc(100vh - 185px)">) он работает отлично, но когда я помещаю его во внешнем CSS он перестает работать:

style.css:

.order-modal-body { 
    height: calc(100vh - 185px); 
} 

page.html

<div class="order-modal-body">xyz<div> 

И он работает, только если я использую единицы того же типа (оба vh или px).

Должен ли я использовать его встроенный или есть решение использовать правило во внешнем css?

EDIT: Использование отсутствует для внешних стилей.

EDIT: MCVE с вопросом и решения: http://codepen.io/anon/pen/VPyPNR

Answer 1

Если вы используете МЕНЬШЕ попробовать это:

height: calc(~"100vh - 185px");