CODEWITHSUNDEEP
csssass
Tanasos
Tanasos

Reputation: 4098

Bourbon's Neat grid columns not working properly

I am currently creating a simple project using Bourbon's Neat grid system, and currently I am trying to create a 3 column list of 6 objects in total, but when I try to span them at 4 columns each, something happens and they become only 2 columns.

It adds margin only on the right side of each element, but that is okay since everything is pre-set I guess? So that is not the problem.

What can I do to make this work?

Here is the SASS excerpt:

    #serviceList {
       @include row();

       li {
           @include pad(1em);
           @include span-columns(4 of 12);

           img, p {
               float: left;
           }
       }
    }

Thanks in advance!

Upvotes: 0

Views: 247

Answers (1)

Tanasos
Tanasos

Reputation: 4098

I managed to sort it out. In a way...

#serviceList {
@include row();

li {
    @include pad(1em);
    @include span-columns(4);
    @include omega();
    img, p {
        float: left;
    }
  }
}

enter image description here

I added the "@include omega();" mixin that removes the gutter margin between them. But since I am new to Neat, I am wondering if that is the right way to do it? Can someone explain?

Upvotes: 2

Related Questions