IE11 muestra cada elemento {display: table-cell} en una nueva línea

Tengo el siguiente HTML ( JSFiddle ):

Y el siguiente CSS:

 .tabled-contents { display: table; width: 100%; } .form-group input[type=text], .form-group input[type=submit] { display: table-cell; width: 200px; } 

Se ve como se espera en todos los navegadores (Chrome, FF, etc.): ambas input están en la misma fila.
Pero en IE11, la segunda input se representa debajo del primero.

¿Alguien sabe por qué es así y cómo hacer que se muestre en IE de la misma manera que en los otros navegadores?

Envié un informe de error al equipo de desarrollo de IE y se ha aceptado como el problema.

Actualizaré esta publicación al cambiar el estado del error.

Solución

agregar un div vacío

 

Ejemplo Codepen http://codepen.io/vinaymavi/pen/JWjxJb

 
Cell-1
Cell-2
Cell-3

Para obtener más información, compruebe el error de Microsoft https://connect.microsoft.com/IE/feedbackdetail/view/1263383/ie11-shows-every-html-input-element-with-display-table-cell-css-style-at -a-new-line #