0

Zurb Foundation の Gridを使用してフォームをレイアウトしています。最初のいくつかのテキストをフロートさせ、入力を選択して 2 列にレイアウトすると、それらをクリックして編集することができなくなりました。入力をタブで移動することで編集できることに注意してください。

問題を示す例を確認してください。

フローティング入力の下のテキストエリアをクリックしてフォーカスし、通常どおり編集できます。

float: left;すべての要素からを削除すると、form#Form_Form div.field.text, form#Form_Form div.field.dropdown通常どおり編集できました。

クリックされたときにフローティング入力がフォーカスを受け取るのを妨げているのは何ですか?

いくつかの調査の後、私はその理由を発見しました.次の答えが同じ問題で立ち往生している他の人に役立つことを願っています.

4

1 に答える 1

1

私がしなければならなかったのは、テキストエリアもフロートすることだけでした。作業サンプルを参照してください。

form#Form_Form div.field.textarea {
    ...
    float: left;
    // clear: both;  // clearing also worked.
}

フローティングされていない textarea の div は、フローティングされた入力を「カバー」していたため、マウスでクリックしたときに入力がフォーカスを受け取れませんでした。したがって、別の解決策は、「z-index」を変更して、テキストエリアの div が浮動入力の下になるようにすることです。

于 2013-03-31T04:37:01.133 に答える