CODEWITHSUNDEEP
cssinternet-explorer-9
pmartynov
pmartynov

Reputation: 21

Why doesn't IE9 apply css with many selectors?

I've encountered an issue that is IE9-specific and need some assistance in order to get to the roots of it. We use SCSS on our project and as the project grows it sometimes appears that we have a files with deep trees.

Here is the SCSS construction that breaks the layout of the page (seems like the styles after this one are not applied at all):

.a {
  ...
  .b {
    ...
    .c, .d, .e, .f {
      ...
      .g {
        ...
        .h {
          ... 
        }
      }
    }
  }
}

Removing the class .h fixes the problem. Removing the class .f also fixes the problem.

This construction IE9 also don't like:

.a {
  ...
  .b {
    ...
    .c, .d, .e {
      ...
      .g {
        ...
        .h {
          ... 
        }
        .i {
          ... 
        }
      }
    }
  }
}

What could be the reason? I've checked that the issue is not dependent on the length of the class names.

Upvotes: 1

Views: 152

Answers (1)

pmartynov
pmartynov

Reputation: 21

Thank you all for investigating. I've solved the problem while minimizing css file for uploading an example to jsFiddle. Actually we exceeded IE limit of 4096 selectors per stylesheet and that caused problems with the layout. I still don't understand why the same css-file works in IE8 although this browser claims to have the same selectors limit.

Upvotes: 1

Related Questions