0

When I use @include breakpoint(min-resolution: 1.5dppx),

I get this output:

@media (min-resolution: 1.5dppx), (-webkit-min-device-pixel-ratio: 1.5), (min--moz-device-pixel-ratio: 1.5), (min-resolution: 144dpi)

This shortcut is fine, but if I try to combine it with another query like this:

@include breakpoint(min-resolution: 1.5dppx, 2050px)

I get exactly the same (the last part is removed)

Then if I add some quotes:

@include breakpoint("2050px, min-resolution 1.5dppx")

I loose the cross-browser part: @media (min-width: 2050px, min-resolution 1.5dppx)

Is there a way to combine them successfully?

ozahorulia
  • 9,798
  • 8
  • 48
  • 72
eradrix
  • 1
  • 1

1 Answers1

0

When using or queries passed directly into the Breakpoint mixin, you need to wrap the whole query in parenthesis as the second argument to the Breakpoint mixin is no-query. You should be writing the following:

@include breakpoint((min-resolution 1.5dppx, 2050px)) {}

Take a look at this SassMeister Example to see it working in action.

Snugug
  • 2,358
  • 1
  • 16
  • 18