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.