0

I have the following sass code for a grid column:

https://codepen.io/anon/pen/zpwpOm?editors=1100

Since the grid width is 1140px (max size triggered) and $gutter-horizonta is 60px, each column width should be 540px so I would have 540px + 60px + 540px = 1140px.

However when I run it in my node-sass and sass-loader ,for some reason the column width that appears when I inspect the element in any browser is 47% which is no sense since 47% is 535.8px not 540px.

Why is the following code being converted to no sense percentages? width: calc((100% - #{$gutter-horizontal}) / 2)

It should be converted to 540px not 47% screen shot 2017-12-30 at 10 46 31

Of course I end with a unexpected spacement aftet the second column:

screen shot 2017-12-30 at 10 07 22

Leoni
  • 116
  • 9
  • why it should be converted to px and not % ? the % is more logic for me ... as it's not fixed but relative,when you will resize your screen it will change. So it's logic to obtain % at the end – Temani Afif Dec 30 '17 at 14:49
  • But the calculation should result into 1140px don't you agree? So why it doesn't? – Leoni Dec 30 '17 at 16:06

0 Answers0