SharePoint Dragons

Recently, we experienced a weird problem in MSIE 9 where select boxes kept closing themselves when hovering over them, in later browsers we didn’t experience this issue. It turned out that this was caused by multiple CSS selectors pertaining to font families defined in different CSS files which were targeting the same select box. Both CSS files did something like:

select {font-family:’Avenir LT W01 85 Heavy’;}

Removing one of them solved the issue, and allegedly this should do the trick too:

select option {font-family:’Avenir LT W01 85 Heavy’;}

This is described in more detail at: http://stackoverflow.com/questions/5551288/ies-select-boxes-closes-themselves-when-hovering

In the process, we found that MSIE 11 Enterprise Mode causes the browser to run in IE 8 compatibility mode, but this didn’t cause the self-closing select box problem, so this compatibility mode doesn’t seem to be full-fidelity. This can be turned on or off by opening MSIE 11, press ALT > Tools > Enterprise Mode (or: ALT > Extra > Ondernemingsmodus in Dutch). Read more about MSIE 11 Enterprise mode over at: http://www.zdnet.com/article/internet-explorer-11-to-get-new-enterprise-mode/

It also turned out that the problem didn’t appear in MSIE 11 compatibility mode (press F12, next to the Search box choose a compatibility mode such as 8, 9, or 10). As it turned out we were able to use IETester (http://www.my-debugbar.com/wiki/IETester/HomePage) and it was able to simulate MSIE 9 in such a way that we could reproduce the self-closing CSS issue.