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

Edge issue with class(es) on [deckgrid] #105

Open
chaelli opened this issue Jan 26, 2016 · 2 comments
Open

Edge issue with class(es) on [deckgrid] #105

chaelli opened this issue Jan 26, 2016 · 2 comments

Comments

@chaelli
Copy link

chaelli commented Jan 26, 2016

If you have issues with edge not respecting the media queries - make sure you have no classes on the [deckgrid] element. Edge will return this:
[deckgrid].classname::before
as a selector and therefore does not match the used regex

@Shingaz
Copy link
Contributor

Shingaz commented Jan 26, 2016

@chaelli, what your CSS looks like without a class on the deckgrid element? How do you configure the responsiveness?

Edit: fixed with PR #102

@chaelli
Copy link
Author

chaelli commented Jan 27, 2016

@Shingaz:

[deckgrid] {
    overflow: hidden;
    &:before {
      font-size: 0;
      visibility: hidden;
      content: '1 .example__item-column--1';

      @include dao-mq-min(500px) {
        content: '2 .example__item-column--2';
      }

      @include dao-mq-min($bp-s-max) {
        content: '3 .example__item-column--3';
      }

      @include dao-mq-min($bp-m-max) {
        content: '4 .example__item-column--4';
      }
    }
  }

and btw. - I needed this to make sure the columns always have enough space in edge:

.example__item-column--2 {
  width: calc(100%/2.0001);
}

.example__item-column--3 {
  width: calc(100%/3.0001);
}

.example__item-column--4 {
  width: calc(100%/4.0001);
}

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

No branches or pull requests

2 participants