web-dev-qa-db-ja.com

テキストフィールドがサファリで機能しない

私はオンラインeBay利益予測計算機で作業しています ここ

入力フィールドをサファリとモバイルサファリで動作させることができないようです。 FFおよびChromeで正常に動作します。私はそれらをクリックしますが、入力しても何も表示されません。私はグーグルを検索してきましたが、手がかりを見つけることができないようです。私はCSSで何かを見逃しているのだろうかと思っています。入力フィールドの私のcssは次のとおりです。

input {
    width: 155px;
    padding-left: 5px;
    height: 24px;
    cursor: text;
    font-size: 18px;
    font-weight: bold;
    border: none;
    border-radius: 3px;
    box-shadow: inset 1px 1px 2px black;
    -moz-box-shadow: inset 1px 1px 2px black;
    -webkit-box-shadow: inset 1px 1px 2px black;
    background-color: #F8FBEF;
 }
28
Chip

問題はcalcstyle.css ここに:

* { 
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

なぜかわからないuser-select: none;は入力に入力できないようにしますが、このブロックを削除することで修正されます。


編集

考えられる解決策は次のとおりです。

すべてを選択しかし入力...

*:not(input.field) {    
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
54
Turnip

これはまだSafari 9.0.3およびiOS 9.2の問題のようです。最終的にそれを修正したのは、textに設定することでした:

input, textarea {
  -webkit-user-select: text;
  -khtml-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
}
11
Markus