diff --git a/index.html b/index.html
index 143d5f447..46acb2521 100644
--- a/index.html
+++ b/index.html
@@ -5,7 +5,7 @@
diff --git a/src/atom/pane.coffee b/src/atom/pane.coffee
index c7f3d1bf8..a8e19ca4a 100644
--- a/src/atom/pane.coffee
+++ b/src/atom/pane.coffee
@@ -16,10 +16,8 @@ class Pane
switch @position
when 'main'
- # There can be multiple 'main' panes, but only one can be active
- # at at time. ICK.
- $('#main-container').children().css 'display', 'none !important'
- $('#main-container').append @pane
+ $('#main > div').addClass 'hidden'
+ $('#main').append @pane
when 'top'
verticalDiv.prepend @pane
when 'left'
@@ -32,19 +30,17 @@ class Pane
throw "pane position of #{this} can't be `#{@position}`"
showing: ->
- @pane and not @pane.css('display').match /none/
+ @pane and not @pane.hasClass 'hidden'
show: ->
- if @position == 'main'
- $('#main-container').children().css 'display', 'none !important'
-
if not @pane
@add()
else
- @pane.css 'display', '-webkit-box !important'
+ $('#main > div').addClass 'hidden' if @position == 'main'
+ @pane.removeClass 'hidden'
hide: ->
- @pane.css 'display', 'none !important'
+ @pane.addClass 'hidden'
toggle: ->
if @showing()
diff --git a/static/atom.css b/static/atom.css
index 7b10ac235..d60add654 100644
--- a/static/atom.css
+++ b/static/atom.css
@@ -22,10 +22,20 @@ body {
-webkit-box-orient: vertical;
}
+#main {
+ display: -webkit-box;
+ -webkit-box-flex: 1;
+ -webkit-box-orient: vertical;
+}
+
.main {
-webkit-box-flex: 1;
}
+.pane.hidden {
+ display: none;
+}
+
.pane {
display: -webkit-box;
-webkit-box-orient: vertical;