diff --git a/frontend/src/metabase/components/LoadingAndErrorWrapper.jsx b/frontend/src/metabase/components/LoadingAndErrorWrapper.jsx
index a0fc95eae3c38bc1107a25b7cd74f5569dfd811c..c5fd86d101bbcf8736044228f4230f1de6ce0212 100644
--- a/frontend/src/metabase/components/LoadingAndErrorWrapper.jsx
+++ b/frontend/src/metabase/components/LoadingAndErrorWrapper.jsx
@@ -60,7 +60,7 @@ export default class LoadingAndErrorWrapper extends Component {
             <div className={this.props.className} style={this.props.style}>
                 { error ?
                     <div className={contentClassName}>
-                        <h2 className="text-normal text-grey-2">{this.getErrorMessage()}</h2>
+                        <h2 className="text-normal text-grey-2 ie-wrap-content-fix">{this.getErrorMessage()}</h2>
                     </div>
                 : loading ?
                     <div className={contentClassName}>
diff --git a/frontend/src/metabase/css/core/flex.css b/frontend/src/metabase/css/core/flex.css
index 9a4514ac1f1d277c9b74de2a62db8c6893afb104..c31d92b01553c4b6461f7faa2e314df528243450 100644
--- a/frontend/src/metabase/css/core/flex.css
+++ b/frontend/src/metabase/css/core/flex.css
@@ -156,3 +156,10 @@
 @media screen and (--breakpoint-min-md) {
     .md-no-flex { flex: 0 !important; }
 }
+
+/* Contents of elements inside flex items might not be wrapped correctly on IE11,
+   set max-width manually to enforce wrapping
+*/
+.ie-wrap-content-fix {
+   max-width: 100%;
+}
\ No newline at end of file