2011-12-11 12 views
0

私はULとjQuery Validateを使ってログインフォームを持っています。 IE7以外のすべてのブラウザで問題なく表示されます(IE6を心配する必要はありません)IE7 CSSの検証エラースタイリング

IE7では、label.errorをラップするliは、その段階でlabel.errorが隠されていても完全な高さを示します。

私が助けてくれる人は、私はCSSでこれを解決する方法を見つけられていないし、そう簡単に何かのためにjQueryを使いたくない。ここで

は、URL、 http://clintongreen.com/clients/researchreview/ログインフォームを使用すると、右上の「ログイン」をクリックしたときに私が最初に同じリスト内の各エラーラベルを入れしようと

おかげ

答えて

1

を示されています項目を入力として使用します。

<li><input type="text" name="login_username" id="login_username" placeholder="Username "> 
    <label class="error" for="login_username" style="display:none;">Please enter your username</label></li> 

これは、余分な改行を引き起こす「空の」リスト項目を排除します。ログインボックスのサイズが設定されている場合、メッセージは表示されると次の行に折り返されます。 (デフォルトのディスプレイの代わりにdisplay:ブロックを指定することもできます:インライン)。

個人的にはフォームフィールドに順序のないリストを使用しません。フィールドセットを使用して(この場合は)入力とラベルに固定幅と表示:ブロックを指定します。しかし、それは私だけです。

...私は質問する必要があります...このようなhtmlを変更していますか?

+0

こんにちは、このメソッドを試してみましたが、label.errorは余白の上端または下端のスタイルをサポートしないため、スタイリングの問題で終わります。乾杯 –

+0

ああ、display:blockまたはdisplay:inline-blockを使用した場合に表示されます。私はあなたが$ .show()でそれを指定できるかどうかは確かではありません。 $ .css( 'display'、 'block')を明示的に使用する必要があります。 – eric

+0

クール、私は今夜それを試してみるよ、ありがとう –