Dnes naši vývojáři řešili zajímavý problém, kdy se rozbalovací menu nekontrolovaně skrývalo při přechodu mezi prvky. Nejzajímavější na tom bylo, že menu se korektně chovalo v mozille, chrome, ale hlavně v Internet exploreru 8 a 11. Chyba tedy pouze v Exploreru 9 a 10.
Hned po zjištění jsme začali řešit první problém: „Kde sehnat Internet Explorer 9 a 10“, protože emulaci v Exploreru 11 příliš nevěříme. Po zajištění exploreru jsme se pustili do testování.
kód menu:
<ul> <li>menu 1 <ul> <li>podmenu 1</li> <li>podmenu 2</li> </ul> </li> <li>menu 2</li> </ul>
Mezi jednotlivými položkami podmenu byla 1px mezera. A právě v této mezeře byl celý problém. Explorer 9 a 10 při najetí na mezeru menu skryli.
Odstraňování problému
- test menu bez mezery
testovali jsme, jestli chyba není v menu obecně, ne jen mezerách. Zrušili jsme mezeru a vyzkoušeli. Menu fungovalo bez problému. - test s pevnou výškou prvků
nastavili jsme pevnou šířku li, tak aby bylo ul plně vyplněno. Na odkazy v seznamu jsme aplikovali výšku o 1px menší. Tím byla zajištěna mezera i plné vyplnění podmenu. Vyzkoušeli a menu se opět zobrazovalo chybně.
Finální řešení
Jelikož ani jedno z řešení nepomohlo, museli jsme šáhnout pro řešení 1px mezery pomocí border. Toto řešení není optimální ale chyba v IE 9 a 10 nenavrhla jiné vhodnější řešení.