Alternating Comment Backgrounds

Thanks to EE’s “switch” tag, creating alternating comment backgrounds (which you can see in the comments on this site, such as here) is very easy to do.

First, create two classes in your CSS, one for each style:





.oddcomments {


font-size: 10px;


text-align: justify;


line-height: 120%;


background: #ccc;


margin-top: 5px;


padding: 5px 5px 5px 5px;


border: 1px solid #999;


}





.evencomments {


font-size: 10px;


text-align: justify;


line-height: 120%;


background: #fff;


margin-top: 5px;


padding: 5px 5px 5px 5px;


border: 1px solid #999;


}







Then, on your comment or permalink page, do something like the following:





{exp:comment:entries}


<div class="{switch="oddcomments|evencomments"}">


{comment}


<div class="posted">Posted by {name} on {comment_date format='%F %d, %Y'}</div>


</div>


{/exp:comment:entries}






Easy, huh?


Posted on October 22, 2004 at 03:00 PM in Tips
Email this entry

The trackback URL for this entry is: Trackbacks are disabled for this entry

Trackbacks:

No trackbacks yet.

Comments:

No comments yet.

Next entry: Site List

Previous entry: MT Modern for EE