HMS Testimonials
[resolved] nth-child = auto styling (1 post)

  1. chappie
    Posted 2 years ago #

    After playing around, I found a great way to style my Testimonials page automatically so that each alternate testimonial is styled differently. You ca use it to break up the page so that testimonials are alternately black/gray, normal/italic, light/bold or whatever you want - without ever needing to style testimonials individually.

    It makes use of the pseudo class, nth-child. Give it a whirl:

    /* testimonials page vary style for alternate texts  */
    .hms-testimonial-container:nth-child(even) {
    font-style: italic;
    color: #606060;

    This changes every even numbered testimonial. If you want to apply a different style to the odd numbers, just change "even" to "odd" when you repeat the code.

    I think you can extend the styling to the widget too if you change the target to .hms-testimonial-group - or you can apply different alternate styling to the widget by using .hms-testimonials-rotator.


Topic Closed

This topic has been closed to new replies.

About this Plugin

  • HMS Testimonials
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic