1

リストのすべての要素にパディングを適用しようとしていますが、何らかの理由で最初の要素でしか機能しません。それはどうあるべきですか?もしそうなら、リスト内のすべての要素にスタイルを適用するにはどうすればよいですか?

これは私が現在持っているコードです。10px のパディングは、最初の要素でのみ機能します。リスト内のすべての要素に適用したい:

<c:forEach items="${list}" var="child" varStatus="status">
  <div id="${status.count}" style="padding-top: 10px;">

  </div>
</c:forEach>

上記のコードを次のように変更してみました

 <c:forEach items="${list}" var="child" varStatus="status">
      <div class = "itemWithPadding">

      </div>
    </c:forEach>

私のcssファイルには次のものがあります:

 .itemWithPadding {
      padding-top: 10px;
    }

レンダリングされた html は次のようになります。

<div class="itemWithPadding"> -stuff inside- </div> 
<div class="itemWithPadding"> -stuff inside- </div> 
<div class="itemWithPadding"> -stuff inside- </div> 

もちろん、html ソース コードから div タグ内のコンテンツを削除しました。しかし、問題を診断するために内部のコンテンツ<div>が必要な場合は、レンダリングされたとおりに投稿できます。

4

3 に答える 3

0

適用する CSS クラスを指定しますpadding-top

<style type="text/css">
    .itemWithPadding {
      padding-top: 10px;
    }
</style>

<c:forEach items="${list}" var="child" varStatus="status">
  <div id="${status.count}" class="itemWithPadding">

  </div>
</c:forEach>
于 2013-04-04T18:57:47.580 に答える