最小宽度不@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; 
    } 
}