Merge pull request #1253 from metabase/ie_bugs

Various IE (and Safari) display bugs

frontend/src/components/modal/modal.css

@@ -50,7 +50,7 @@
 }
 
 .Modal-content.Modal-content--small .Modal-body {
-    min-height: unset; /* using unset here to get around overly restrictive min-height settings */
+    min-height: inherit; /* using inherit here to get around overly restrictive min-height settings */
 }
 
 .Modal-body .Form-inputs {

frontend/src/css/query_builder.css

@@ -255,6 +255,12 @@
   background-image: url('/app/img/no_understand.svg');
 }
 
+.QueryError-message {
+  /* IE flexbox align-items:center bug workaround */
+  /* https://github.com/philipwalton/flexbugs#2-column-flex-items-set-to-align-itemscenter-overflow-their-container */
+  max-width: 100%;
+}
+
 .QueryError-messageText {
   line-height: 1.4;
 }

frontend/src/home/components/RecentViews.jsx

@@ -63,7 +63,7 @@ export default class RecentViews extends Component {
                     :
                         <div className="flex flex-column layout-centered text-normal text-grey-2">
                             <span className="QuestionCircle mt4">!</span>
-                            <p className="p3 text-centered text-grey-4">You haven't looked at any Dashboards or Questions recently?</p>
+                            <p className="p3 text-centered text-grey-4" style={{ "maxWidth": "100%" }}>You haven't looked at any Dashboards or Questions recently?</p>
                         </div>
                     }
                 </div>