0

次のアイデアを実現する方法を知りたいです。

登録フォームがあります。PHP エラー メッセージの場合、特定のエラー メッセージが表示される各入力フィールドの横に div を表示したいと思います。そのため、現時点では、その div を他のすべての div の前に設定するという CSS の問題があります。そこでZ-indexを見始めたのですが、なぜかうまくいきません。

私は自分のcssに持っています:

#form-error{
  background-color: #f23;
  z-index:1;
  width: 200px;
  height: 50px;
}

そしてHTMLで：

<?php if(isset($errors)):?>
  <?php foreach($errors as $error):?>
    <div id="form-error">
    <?php echo $error;?>
    </div>
  <?php endforeach;?>
<?php endif;?>

ですから、これを解決する方法についてのアイデアに非常に興味があります。

どうもありがとう。

アップデート

ユーザー偏向の助けを借りて、私は立場表明を追加する必要があることを認識しました。私はそうしました。これで、すべてのエラー メッセージが一覧表示されました。

このユーザーは、php ロジックを再編成して、入力フィールドの横にあるフォーム エラー クラスのボックスに追加する必要がある特定のエラー メッセージを 1 つ持つ方がよいと述べました。これは問題ではありません。配列から各エラーメッセージを取得できます。私の問題は、入力フィールドの横にこれらのボックスがあることをどのように認識するかです。

4

1 に答える 1

4

position:relative;z-index を機能させるには、CSSに 、position:absolute;、またはを追加する必要がありますposition:fixed;。

他に何が問題なのかはわかりませんが、次のように CSS に追加することから始めます。

#form-error{ 
    position: relative;
    background-color: #f23; 
    z-index:1;  
    width: 200px; 
    height: 50px; 
}
于 2012-07-10T15:48:52.970 に答える