我的canvas元素在Internet Explorer 9＆amp; 10，它应该是它应该的高度的一半 画布应该是一个响应的640x480盒子，有一个大的红色圆圈，而不是椭圆形的椭圆形。我希望它能采用css规范修复，但我不清楚css或javascript修复是什么。
在ie10和ie9中它看起来像这样： http://s7.postimg.org/4xtb6vjkr/ie10.png
可以在此处看到chrome，firefox，safari和ie11中的代码和正确显示：
http://jsbin.com/vutiqatowo/1/edit?html,css,js,output
这是项目的向后兼容性要求，因此希望访问者不使用ie10不是一个选项。
答案 0 :(得分：0)
我在Google搜索结果中看到用height:auto 解决方案替换height:100%，但它不适用于对我来说问题的网页。
我发现这个媒体查询攻击-ms-high-contrast，这适用于扭曲的画布显示。它没有提供平滑缩放，但它可以正确显示画布元素。
这是一个小提琴示例：http://jsfiddle.net/trents_luck/abhbmsd6/
在小提琴示例中，可以在CSS的底部看到媒体查询黑客，他们读到这样的内容：
@media (-ms-high-contrast: active) and (min-width: 100px),
(-ms-high-contrast: none) and (min-width: 100px)