inline-flex input element breaks to new line in IE11
问题 I have a few html elements next to each other in a container positioned with display:inline-flex . This works well for button elements, but as soon as I try to add an input type="text" element, the textbox is placed below the buttons (only in Internet Explorer 11; not sure about IE10 or below). It works as expected (textbox in same line as buttons) in Firefox, Chrome and even Edge. How can I get IE to display this correctly? See jsFiddle for full html and css code to illustrate the problem: