title: Less organize :nth-child active states
body: <p>I'm using less for this project and currently designing a navigation bar and using <code>:nth-child</code> to style the <code>li</code> elements by multiples of 3. I'm also trying to manage <code>active</code> states (shown below under <code>//li active states for nav</code> comment).</p>
  
  <p>I'm trying to make any active <code>li</code> item have <code>background-color: white</code>. The solution below adds:</p>
  
  <pre><code>            &amp;:nth-child(3n + 1):hover {
                background-color: white;
              }
  </code></pre>
  
  <p>to <em>each</em> of the active <code>:nth-child</code> declarations. Surely there is a way to do something like <code>&amp;:nth-child(all):hover</code> or something that's DRYer than what I have below. See my LESS:</p>
  
  <pre><code>       li {
            color: white;
            padding: 0.9em;
            // nav item 1 and multiple
            &amp;:nth-child(3n + 1) {
              border-top: 2px solid @blue;
              &amp;:nth-child(3n + 1):hover {
                background-color: @blue;
              }
            }
            // nav item 2 and multiple
            &amp;:nth-child(3n + 2) {
              border-top: 2px solid @red;
              &amp;:nth-child(3n + 2):hover {
                background-color: @red;
              }
            }
            // nav item 3 and multiple
            &amp;:nth-child(3n + 3) {
              border-top: 2px solid @green;
              &amp;:nth-child(3n + 3):hover {
                background-color: @green;
              }
            }
          }
          // li active states for Nav
          .active {
            background-color: white;
            &amp;:nth-child(3n + 1) {
              color: @blue;
              &amp;:nth-child(3n + 1):hover {
                background-color: white;
              }
            }
            &amp;:nth-child(3n + 2) {
              color: @red;
              &amp;:nth-child(3n + 2):hover {
                background-color: white;
              }
            }
            &amp;:nth-child(3n + 3) {
              color: @green;
              &amp;:nth-child(3n + 3):hover {
                background-color: white;
              }
            }
          }
  </code></pre>