IE10/11でCalc（）を使用したトランジションの高さ

Question

私はUsing calc() to transition width and height in IEを見てきましたが、私の問題はこの質問に対するAcceptedの回答と関係していると言いたいと思います。

私はテストしている他のブラウザと一緒にIE 11で正しく動作しますが、私は作成しているwebappでは、幅ではなくDivの高さだけを移動する必要があります。だから私はmax-heightにmax-widthを変える受け入れ答えソリューションを作成し、再度、これは一見高さは、まだ移行していないだろうと同じように動作しません。 MAX-高さが最大幅に比べて、この場合では異なる行うのはなぜ https://jsfiddle.net/esfqqm4p/

.container{ 
    height: 100px; 
    width: 200px; 
} 

.block { 
    width: 100%; 
    height: 100%; 
    background-color: red; 
    transition: all 1s ease-in-out; 
    margin: 10px; 
    padding-left: 10px; 
} 

.doesntwork:hover { 
    max-height: 50%; 
    height: 100%; 
} 
.works:hover { 
    height: 175px; 
} 

：ここ

は修正受け入れ答えの私のフィドルのですか？私が見逃したことはありますか？ IE10/11で高さを変える方法はありますか？

Answer 1

私は昨日、今日は複数の純粋なCSSソリューションを試してみましたが、役に立たなかった。最終的には、JQuery Animate関数を使ってIEでうまくいく目標を達成することにしました。

https://jsfiddle.net/uwrosa3m/

function startAnim(){ 
    if(!$('.block').hasClass("shrunk")){ 
    $('.block').addClass("shrunk"); 
    $('.block').animate({ 'height': '50%' }, 500); 
    } 
    else{ 
    $('.block').removeClass("shrunk"); 
    var height = ($('.block').height() * 2) - 10; 
    $('.block').animate({ 'height': height }, 500); 
    } 
} 

の代わりに、私は単にjQueryのはその問題を処理させる高さを計算するために私のCSSで計算値（）を使用して：ここで

は、ソリューションを展示フィドルです。

誰かが純粋なCSSソリューションを見つけることができれば、それを投稿してください。私はそれを回答として受け入れます。