Dan Brown

Fixed flexbox overflow scrolling issues in firefox

Fixes #111
...@@ -11,13 +11,16 @@ body.flexbox { ...@@ -11,13 +11,16 @@ body.flexbox {
11 #content { 11 #content {
12 flex: 1; 12 flex: 1;
13 display: flex; 13 display: flex;
14 + min-height: 0px;
14 } 15 }
15 } 16 }
16 17
17 .flex-fill { 18 .flex-fill {
18 display: flex; 19 display: flex;
19 align-items: stretch; 20 align-items: stretch;
21 + min-height: 0px;
20 .flex, &.flex { 22 .flex, &.flex {
23 + min-height: 0px;
21 flex: 1; 24 flex: 1;
22 } 25 }
23 } 26 }
......
...@@ -49,7 +49,7 @@ ...@@ -49,7 +49,7 @@
49 height:auto; 49 height:auto;
50 } 50 }
51 h1, h2, h3, h4, h5, h6 { 51 h1, h2, h3, h4, h5, h6 {
52 - clear: both; 52 + clear: left;
53 } 53 }
54 hr { 54 hr {
55 clear: both; 55 clear: both;
...@@ -72,7 +72,7 @@ ...@@ -72,7 +72,7 @@
72 .pointer { 72 .pointer {
73 border: 1px solid #CCC; 73 border: 1px solid #CCC;
74 display: inline-block; 74 display: inline-block;
75 - padding: $-xs $-s; 75 + padding: $-s $-s;
76 border-radius: 4px; 76 border-radius: 4px;
77 box-shadow: 0 0 8px 1px rgba(212, 209, 209, 0.35); 77 box-shadow: 0 0 8px 1px rgba(212, 209, 209, 0.35);
78 position: absolute; 78 position: absolute;
...@@ -135,6 +135,7 @@ ...@@ -135,6 +135,7 @@
135 display: flex; 135 display: flex;
136 transition: width ease-in-out 180ms; 136 transition: width ease-in-out 180ms;
137 margin-top: -1px; 137 margin-top: -1px;
138 + min-height: 0px;
138 &.open { 139 &.open {
139 width: 480px; 140 width: 480px;
140 } 141 }
...@@ -182,6 +183,8 @@ ...@@ -182,6 +183,8 @@
182 display: flex; 183 display: flex;
183 flex: 1; 184 flex: 1;
184 flex-direction: column; 185 flex-direction: column;
186 + min-height: 0px;
187 + overflow-y: scroll;
185 } 188 }
186 div[tab-content] .padded { 189 div[tab-content] .padded {
187 flex: 1; 190 flex: 1;
...@@ -240,6 +243,8 @@ ...@@ -240,6 +243,8 @@
240 min-width: 180px; 243 min-width: 180px;
241 max-width: 320px; 244 max-width: 320px;
242 opacity: 0.7; 245 opacity: 0.7;
246 + z-index: 5;
247 + position: relative;
243 table { 248 table {
244 width: 100%; 249 width: 100%;
245 margin: 0; 250 margin: 0;
......