Still confused with nested grids

Question

I\'ve finally found some time to test Singularity, and im back to a problem I had before for that I cant find an obvious solution.

My issue is with nested grids. Let\'s

Answer 1

So the issue you're having is you haven't changed the grid context and are still using your global 12 column grid context at that point. You need to change your grid context to 9 as you're now inside a 9 column grid. The following should fix your problem:

.highlights{
  overflow: hidden;
  border: 1px solid black;

  article{
    @include layout(9) {
      @include float-span(3);

      &:nth-child(3n){
        @include float-span(1, 'last');
      }
    }
  }
}