私のサイトでは、Windows 7のIE11でテキストボックスを入力できません。テキスト入力フィールドをクリックすると、ページの別の場所にあるフィールドの外側でキャレットが点滅しているのがわかります。 IE11を使用すると、多くのコンピューターで問題を再現できます。
Inspectorを介してIE8を設定すると問題が解決し、IE> = 9で問題が表示されます。サイトはTwitterBootstrapを使用しています。z-indexの修正を試みましたが成功しませんでした。
サイトリンク: http://fortis7.moutheme.com/
height
を指定することで、この問題を修正することができました。
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;
}
}
私にとって> = IE8はボックスサイズのcssプロパティに問題があるように見えます..収まらないテキストを隠しているようです.. IE)のパディングとフォントサイズを調整する必要がありましたこの問題を修正するには。これが同じ問題であるかどうかはわかりませんが、一見の価値があります。
同じ問題が発生し、すべての入力に2.4375remの高さを設定したのはCSSフレームワーク(Foundation)の設定であることがわかりました...これをオーバーライドする必要があります!のようなもので
[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;
}
これは、InternetExplorerがフォントサイズのVWまたはVHのCSS値を理解できないためです。テキストボックスの単位をピクセル(PX)に戻すだけで、問題は解決します。