Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

4.0.0-beta.3 - breakpoints are broken in Safari with new support for fractional viewport widths #25166

Closed
liquidvisual opened this issue Jan 2, 2018 · 3 comments
Assignees

Comments

@liquidvisual
Copy link

Beta 3 has broken some of my sites that were using the breakpoint-down mixin. This seems to only be affecting Safari (MacOS and iOS).

I realise this has to do with the support for fractional viewport widths as discussed here.

I've put together a Codepen to demonstrate this:

https://codepen.io/liquidvisual/pen/VyWMGM?editors=1100 (open in Safari)

@patrickhlauke
Copy link
Member

Due to a bug in Safari. Will see if there's some way to work around this bug.

@patrickhlauke
Copy link
Member

@MartijnCuppens
Copy link
Member

MartijnCuppens commented Jan 2, 2018

This case can easily be solved with not: https://codepen.io/MartijnCuppens/pen/LeLgRN/?editors=1100

However, for media-breakpoint-between and media-breakpoint-only this will not solve a thing because you can only use not to invert a media-query-rule and not a part of a media-query rule.
For example @media (min-width: $min) and not (min-width: $max) doesn't work.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

3 participants