I'm having issues on Firefox (fine in Chrome) with a flexbox input group - the select input is pushing the text input out of the container.
I've extracted some of the markup and replicated the relevant styling below:
.column.names { width: 48%; float: left;}select { min-width: 6em; align-items: center; justify-content: center; width: 7em;}input { width: 100%;}.input_group { display: flex;}
<div class='column names'><div><label for="user_name">Name</label><div><div class='input_group'><select name="user[title]" id="user_title"><option value=""></option><option selected="selected" value="Mr">Mr</option><option value="Mrs">Mrs</option><option value="Other">Other</option></select><input maxlength="255" size="255" type="text" name="user[name]" id="user_name" /></div></div></div><div><label for="user_company">Company</label><div><input maxlength="255" size="255" type="text" value="" name="user[company]" id="user_company" /></div></div></div>
https://jsfiddle.net/j9s0fk8c/
To clarify, the Name select + input box combined should be the same width as the Company input box.
Again this has been fine in Chrome but for some reason flexbox is giving us no end of issues in Firefox (this is just one in a long line of weird issues we've had to deal with)