Search code examples
csssassbootstrap-4incompatibletypeerror

Incompatible units: 'rem' and 'px' with bootstrap 4 alpha 6

I am trying to implement a bootstrap 4 template (I use bootstrap 4 alpha 6) and see such an error:

Incompatible units: 'rem' and 'px'.

in line 

$input-height: (($font-size-base * $input-btn-line-height) + ($input-btn-padding-y * 2)) !default;

Did somebody experience similar issue? Thanks!

Solution

  • Bootstrap moved from pixels (px) in version 3 to rem in version 4.

    In resources/assets/sass/_variables.scss replace:

    $font-size-base: 14px; with $font-size-base: 1rem;

    In general, Bootstrap 4 uses 'rem' instead of 'px'. For reference, look at https://github.com/twbs/bootstrap/issues/17070