If you have ever experienced this…
…you know how painful it is to debug and rectify.
This error was so common that Microsoft created a knowledge base (
KB927917) article for this. It even has a dedicated explanation at the IE Blog. The error basically is – “HTML Parsing Error: Unable to modify the parent container element before the child element is closed (KB927917)”.
While building the Social sharing plugins for AdoMado, we were facing similar problems. Anywhere FB share, Orkut share or Digg buttons were being used, IE was complaining of exactly the same problem. Since social share plugins are the backbone of our community building process, fixing this ASAP was high on my agenda.
NOTE – There was no such problem on any version of Firefox or Chrome.
If you notice the IE blog entry, they mention that
Moving the location of your script block to a child of the body (this usually solves most problems, while allowing the most flexibility in terms of scenarios).
can be a possible solution.
First things first… I refactored the code in such a way that all possible usage of problem causing scripts was moved to one single partial. Now error was originating from only one location. The fix, as mentioned on the IE blog – was then straight forward.
Here are some screen captures from our codebase…
Notice the “yield :delayed_loading” block…
Yield’ing to delayed_loading block.
If you browse over to our offer – Send Ad Free SMS using IE, you will notice that you see no such error. All the social share plugins render in harmony.
I’ve even thrown in a little jQuery fadeIn magic