Support » Plugin: Gravity Forms Repeater Add-On » Styling even and odd repeats

  • Hi,

    I have a large amount of inputs tucked within the repeater field. I would like to style even blocks differently than odd blocks. Im pretty decent at CSS, but I can’t think of a very good way to do this.

    Actually I JUST came up with this (there’s 7 input in the repeater):

    [data-repeater-childid="1"]:nth-of-type(even),
    [data-repeater-childid="2"]:nth-of-type(even),
    [data-repeater-childid="3"]:nth-of-type(even),
    [data-repeater-childid="4"]:nth-of-type(even),
    [data-repeater-childid="5"]:nth-of-type(even),
    [data-repeater-childid="6"]:nth-of-type(even),
    [data-repeater-childid="7"]:nth-of-type(even) {
      background: red;
    }

    Any ideas on a better solution?

    • This topic was modified 2 years, 5 months ago by Stegosource.
    • This topic was modified 2 years, 5 months ago by Stegosource.
Viewing 1 replies (of 1 total)
  • Here is the code that works, but is still tied to the number of inputs. Maybe someone knows a better solution…

    .client-referral [data-repeater-childid="1"]:nth-of-type(even),
    .client-referral [data-repeater-childid="2"]:nth-of-type(odd),
    .client-referral [data-repeater-childid="3"]:nth-of-type(even),
    .client-referral [data-repeater-childid="4"]:nth-of-type(odd),
    .client-referral [data-repeater-childid="5"]:nth-of-type(even),
    .client-referral [data-repeater-childid="6"]:nth-of-type(odd),
    .client-referral [data-repeater-childid="7"]:nth-of-type(even) {
    	background: red;
    }
Viewing 1 replies (of 1 total)
  • The topic ‘Styling even and odd repeats’ is closed to new replies.