Page reloading on form submission in IE10

I recently installed IE10 for Windows 7 and naturally the first thing I did was check how my sites looked with it. Pages were loading in IE10 standards mode and it was great to see new CSS3 features supported. All seemed to work fine, until I tested the search form on one of the sites…

I had entered a search term into the field and pressed enter to search. Users are usually taken direct to a search page although for some reason the page was just reloading each time I pressed return.

I instantly checked this on other sites I’ve worked on, which were all working fine, despite using the same web part for the search form in Kentico. Comparing the two, there seemed to be just one difference – not in the HTML, but in the CSS.

The difference was that my search button was not visible on the page. It turns out that where the submit button is styled with display:none; (as many search forms are) the form will not submit and the page simply reloads.

So far this issue seems to be specific to IE10 and isn’t a problem for other browsers. (I’ve been unable to test this on IE10 for Windows 8). Something to watch out for it you’re having similar issues.