treehouse : what would you like to learn today?
Web Design Web Development iOS Development

[Solved] nth child issues

  • Hello Tricksters!

    I'm experiencing some weirdness with nth child, and I have no idea what is causing it.

    Take a look at the site I'm working on: http://www.mandalacustomshapes.com



    When you shrink the layout and the homepage grid responds - the nth child rules fall apart about half way down the page... This is fixed if I remove one of the board divs. I'm using even and odd as the selector. Am I doing this wrong?



    Any help is always appreciated. and the highest of internet fives if you can help me fix this :)
  • Hi, iagainsti.

    It looks like your problem is here:

    @media screen and (max-width: 980px) {
    section.board-wrapper div:nth-child(3n+0) {
    margin-right: 4%;
    }
    }


    It also looks like that the following is overriding your nth-child(even) selector:

    wrapper div:nth-child(2n+2) {
    margin-right: 0;
    }


    It looks like you are making use of the nth-child selector a few to mant times.

    I hope I have helped!!

    If I wasn't at work, I would try helping you some more!

    -Mike
  • That was it. But I think I need 2 declarations there. I just changed them to even and odd and it works just fine now.
    *EDIT*
    Forgot your super internet high-five! Thanks!