最小寬度不@keyframe動畫工作在IE

Question

想有一個div在頁面加載擴展：

#box { 
width: 10px; height: 10px; 
-moz-animation: expandwidth 1s forwards; 
animation:   expandwidth 1s forwards; 
} 

，而下面的動畫作品如預期在firefox：

@-moz-keyframes expandwidth{ 
    100% {width: 60%; min-width: 800px;} 
} 

此韓元在IE 11「噸相當工作：

@keyframes expandwidth{ 
    100% {width: 60%; min-width: 800px;} 
} 

實際上

，而它不擴大至60％的長度，它沒有考慮到最小寬度要求，這可以很容易地看到我水平縮小瀏覽器大小。然而，在Firefox中，按照預期，它不會縮小到800像素以下。難道我做錯了什麼？我似乎無法找到有關在IE動畫中不支持最小寬度的任何內容。另外請注意，我只在尋找一個css修復程序。謝謝。

編輯：見FFX 31.0 http://jsfiddle.net/qyan20k9/ 作品對我但不是在IE 11

Answer 1

我在IE11，Chrome 38版（64位）& FF31試用了一下，似乎是您建立min-width來上班從...開始。

JSfiddle Demo

#box { 
    width: 10px; 
    height: 30px; 
    min-width:10px; /* here */ 
    -moz-animation: expandwidth 1s forwards; 
    -webkit-animation: expandwidth 1s forwards; 
    animation: expandwidth 1s forwards; 
    background: grey; 
} 
@-webkit-keyframes expandwidth { 
    100% { 
     width: 60%; 
     min-width: 800px; 
    } 
} 
@-moz-keyframes expandwidth { 
    100% { 
     width: 60%; 
     min-width: 800px; 
    } 
} 
@keyframes expandwidth { 
    100% { 
     width: 60%; 
     min-width: 800px; 
    } 
}