HTML/CSS Spans causing problems in IE9

I recently noticed in IE9 that some CSS dropdown menus were very broken. Instead of hiding the drop downs away until needed they were displaying all the time with a transparent background.

After playing around and some testing I found it was down to some <span> tags. In other browsers these were display: none until required and the display: block on parent :hover. It seems that IE9 doesn't like this and a way to fix this is to swap (the normally inline) element <span> for a block element such as a <div>.

Tags: , ,

About Keiron

Web Developer based in the UK. Click here if you want to work with me