CODEWITHSUNDEEP
twitter-bootstrapsassbootstrap-sass
user1937021
user1937021

Reputation: 10801

use percentages for gutter width in Bootstrap SASS

I am trying to set the $grid-gutter-width: variable in the _variables.scss file to 2.4% but I get this error:

Error: Incompatible units: '%' and 'px'.

Is there a way around this?

Upvotes: 0

Views: 489

Answers (1)

Alex Khlebaev
Alex Khlebaev

Reputation: 482

You have variables, which sum percent and pixels. You must to lead variables to the same units or use css calc()

$container-tablet:             (720px + $grid-gutter-width) !default;
$container-desktop:            (940px + $grid-gutter-width) !default;
$container-large-desktop:      (1140px + $grid-gutter-width) !default;

change it to

$container-tablet:             unquote("calc(1140px -"+$grid-gutter-width+")") !default;
$container-desktop:            unquote("calc(1140px -"+$grid-gutter-width+")") !default;
$container-large-desktop:      unquote("calc(1140px -"+$grid-gutter-width+")") !default;

Upvotes: 1

Related Questions