2015-02-18 22 views
6

Domyślnie Neat używa procentów jako marginesu prawego każdego elementu span-columns, ale mam nadzieję na ustaloną rynnę 30px, niezależnie od szerokości outer-container.Ustaw stałą rynnę w Bourbon Neat

enter image description here

+0

Mam ten sam problem i do tej pory nie mogę wymyślić, jak to zrobić za pomocą Neat. –

Odpowiedz

4

Jednym rozwiązaniem byłoby stworzenie własnego wstawek, który zastępuje Neat rynny.

@mixin col-with-gutter($cols, $gutter){ 
    @include span-columns($cols); 
    margin-right: $gutter; 
} 

.half{ 
    @include col-with-gutter(2, 30px); 
} 

Oczywiście trzeba by zrobić jakieś dodatkowe opcje, jeśli chcesz korzystać z niektórych innych span-columns funkcji. Proponuję spojrzeć na _span-columns.scss source, aby dowiedzieć się, co może najlepiej dla ciebie.

Szczerze mówiąc, myślę, że istnieje powód, dla którego ta funkcja nie jest wbudowana. W większości sytuacji ustawienie rynny na 30px byłoby szkodliwe dla responsywnego projektu (ponieważ całkowita szerokość kolumn prawdopodobnie nie będzie dodawana do 100%).

Możesz mieć uzasadniony powód, dla którego chcesz dokładnie 30px, ale jeśli nie masz pewności, potrzebujesz dokładnej wartości, którą warto rozważyć.