From fbf3048d84d954ce6392a3b7ec492c0f0d53e6b0 Mon Sep 17 00:00:00 2001
From: Elastic Jasper <elastic-jasper@users.noreply.github.com>
Date: Wed, 21 Sep 2016 14:11:16 -0400
Subject: [PATCH] Backport PR #8351 ---------

**Commit 1:**
Prevents lengend from expanding page

* Legends will overflow along the y-axis, maintaining a 100% height of the page
* With these changes, space-between would at times place the text out of view

Signed-off-by: Tyler Smalley <tyler.smalley@elastic.co>

* Original sha: bb6632f3c74f459075d1b3184f2be494c5b7655d
* Authored by Tyler Smalley <tyler.smalley@elastic.co> on 2016-09-19T21:29:06Z
---
 .../public/visualize/editor/styles/_editor.less      |  6 ++++++
 src/core_plugins/metric_vis/public/metric_vis.less   |  1 -
 src/ui/public/visualize/visualize.less               | 12 ++++++++++--
 3 files changed, 16 insertions(+), 3 deletions(-)

diff --git a/src/core_plugins/kibana/public/visualize/editor/styles/_editor.less b/src/core_plugins/kibana/public/visualize/editor/styles/_editor.less
index 2ade999bfa68f..8162ecb260004 100644
--- a/src/core_plugins/kibana/public/visualize/editor/styles/_editor.less
+++ b/src/core_plugins/kibana/public/visualize/editor/styles/_editor.less
@@ -7,6 +7,12 @@
 .vis-editor {
   .flex-parent();
 
+  @media (min-width: @screen-md-min) {
+    position: absolute;
+    width: 100%;
+    height: 100%;
+  }
+
   .btn-xs {
     line-height: 1.3;
   }
diff --git a/src/core_plugins/metric_vis/public/metric_vis.less b/src/core_plugins/metric_vis/public/metric_vis.less
index 88abea610948d..4b9e08d88e48b 100644
--- a/src/core_plugins/metric_vis/public/metric_vis.less
+++ b/src/core_plugins/metric_vis/public/metric_vis.less
@@ -7,7 +7,6 @@
   flex-wrap: wrap;
   justify-content: space-around;
   align-items: center;
-  align-content: space-around;
 
   .metric-value {
     font-weight: bold;
diff --git a/src/ui/public/visualize/visualize.less b/src/ui/public/visualize/visualize.less
index bcc52607b16d5..05858172b3d69 100644
--- a/src/ui/public/visualize/visualize.less
+++ b/src/ui/public/visualize/visualize.less
@@ -15,11 +15,19 @@ visualize {
   .vis-container {
     display: flex;
     flex-direction: row;
-
-    flex: 1 0;
     overflow: auto;
     -webkit-transition: opacity 0.01s;
     transition: opacity 0.01s;
+    flex: 1 1 0;
+
+    // IE11 Hack
+    //
+    // Normally we would just set flex: 1 1 0%, which works as expected in IE11.
+    // Unfortunately, a recent bug in Firefox causes this rule to be ignored, so we
+    // have to use an IE-specific hack instead.
+    _:-ms-fullscreen, :root  & {
+      flex: 1 0;
+    }
 
     &.vis-container--legend-left {
       flex-direction: row-reverse;