twitter-bootstrap 无法在 IE11 中输入文本字段
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21295055/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Cannot type in textfields in IE11
提问by Marco Marsala
In my site, I cannot type in textboxes on IE11 on Windows 7. Clicking the text input field, I can see the caret blinking outside the field, positioned in another place in the page. I can reproduce the problem across many computers with IE11.
在我的站点中，我无法在 Windows 7 上的 IE11 上输入文本框。单击文本输入字段，我可以看到插入符号在该字段外闪烁，位于页面的另一个位置。我可以在使用 IE11 的多台计算机上重现该问题。
Setting IE8 via Inspector solves the problem, with IE >= 9 it shows the problem. The site uses Twitter Bootstrap. I tried z-index fixes without success.
通过 Inspector 设置 IE8 可以解决问题，IE >= 9 显示问题。该网站使用 Twitter Bootstrap。我尝试了 z-index 修复但没有成功。
Site link: http://fortis7.moutheme.com/
网站链接：http: //fortis7.moutheme.com/
回答by s10wen
I managed to fix this issue by giving it a height.
我设法通过给它一个height.
回答by Maarten Wolfsen
I found out the box-sizing: border-box;did not work, so I changed it to content-box:
我发现box-sizing: border-box;它不起作用，所以我把它改成了content-box：
@media screen and (-ms-high-contrast: active), screen and (-ms-high-contrast: none) {
/* IE10+ specific style */
input:not([type="select"]),
input:not([type="submit"]) {
padding: 15px 20px;
box-sizing: content-box;
line-height: normal;
width: auto;
height: 15px;
display: inline-block;
}
}
回答by Julesezaar
I had the same problem and found out that it was the setting of my CSS framework (Foundation) that put a height of 2.4375rem to all inputs... You need to override that! With something like
我遇到了同样的问题，发现是我的 CSS 框架（Foundation）的设置为所有输入设置了 2.4375rem 的高度......你需要覆盖它！像这样的东西
[type=color],
[type=date],
[type=datetime-local],
[type=datetime],
[type=email],
[type=month],
[type=number],
[type=password],
[type=search],
[type=tel],
[type=text],
[type=time],
[type=url],
[type=week],
textarea {
height: auto;
}
回答by Jose Browne
For me looks like >= IE8 has a problem with box-sizing css property.. it seems to be hiding text it cant fit.. I had to adjust my padding and font-size for IE to fix this issue. Not sure if this is the same issue you have.. but worth a shot.
对我来说，看起来 >= IE8 的 box-sizing css 属性有问题..它似乎隐藏了它无法容纳的文本..我不得不为 IE 调整我的填充和字体大小来解决这个问题。不确定这是否与您遇到的问题相同……但值得一试。
回答by QMCO
It's because Internet Explorer can't understand a CSS value of VW or VH for a font size. Just change your units for text boxes back to pixels (PX) and the problem goes away.
这是因为 Internet Explorer 无法理解字体大小的 VW 或 VH 的 CSS 值。只需将文本框的单位改回像素 (PX)，问题就会消失。
