¿Por qué IE9 no aplica css con muchos selectores?

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.

preguntado el 28 de agosto de 12 a las 15:08

Can you show us the compiled CSS? -

Please show HTML and CSS that demonstrate the issue. -

1 Respuestas

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.

Respondido 29 ago 12, 17:08

Please mark this answer as the correct one, so that the question will stop showing up in the unanswered list. - troy alford

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.