title: What is the simplest way to divide a variable in SASS?
body: <p>I would like to divide a SASS variable (which is a map value) by two, as follows:</p>
  
  <pre><code>$grid-gutter-widths: (
    xs:  30px,
    sm:  30px
    ...
  );
  
  $col-padding-xs:  #{map-get($grid-gutter-widths, xs)/2}; // returns 15px
  
  div {
    padding-right: $col-padding-xs / 2; // returns 15px/2
  }
  </code></pre>
  
  <p>Unfortunately I was expecting <code>padding-right</code> value to be <code>7.5px</code> however it doesn't perform the division and instead returns a string with the slash in the middle. However this seems to work:</p>
  
  <pre><code>$col-padding-xs: 15px;
  
  div {
    padding-right: $col-padding-xs / 2; // returns 7.5px
  }
  </code></pre>
  
  <p>So the map value must be the wrong type. Is there an easy way to cast it as a number so I can perform simple math on it in SASS?</p>
  
  <p>Thanks for your help!</p>