diff --git a/hledger-web/Handler/Common.hs b/hledger-web/Handler/Common.hs
index 16530a8bc..186a4d645 100644
--- a/hledger-web/Handler/Common.hs
+++ b/hledger-web/Handler/Common.hs
@@ -36,7 +36,7 @@ hledgerLayout vd title content = do
       toWidget [hamlet|
          ^{topbar vd}
          ^{sidebar vd}
-         <div .col-md-8 .col-xs-12 .col-sm-12>
+         <div #main-content .col-md-8 .col-xs-12 .col-sm-12>
           ^{searchform vd}
           ^{content}
       |]
diff --git a/hledger-web/static/hledger.css b/hledger-web/static/hledger.css
index f389c2bc8..a39a24d08 100644
--- a/hledger-web/static/hledger.css
+++ b/hledger-web/static/hledger.css
@@ -157,3 +157,23 @@ ul {
 .negative {
     color: #a94442;
 }
+
+#main-content {
+    -webkit-transition: width 0.3s ease, margin 0.3s ease;
+    -moz-transition: width 0.3s ease, margin 0.3s ease;
+    -o-transition: width 0.3s ease, margin 0.3s ease;
+    transition: width 0.3s ease, margin 0.3s ease;
+}
+
+#sidebar-menu {
+    -webkit-transition: width 0.3s ease, margin 0.3s ease;
+    -moz-transition: width 0.3s ease, margin 0.3s ease;
+    -o-transition: width 0.3s ease, margin 0.3s ease;
+    transition: width 0.3s ease, margin 0.3s ease;
+    overflow:hidden;
+}
+
+.col-any-0 {
+    width:0 !important;
+    float: left;
+}
diff --git a/hledger-web/static/hledger.js b/hledger-web/static/hledger.js
index 3a2058e94..fc04b842d 100644
--- a/hledger-web/static/hledger.js
+++ b/hledger-web/static/hledger.js
@@ -218,21 +218,8 @@ function addformDeletePosting() {
 // SIDEBAR
 
 function sidebarToggle() {
-  var visible = $('#sidebar').is(':visible');
-  // if opening sidebar, start an ajax fetch of its content
-  if (!visible) {
-    $.get("sidebar"
-         ,null
-         ,function(data) {
-            $("#sidebar-body" ).html(data);
-          })
-          .fail(function() {
-            alert("Loading the sidebar did fail");
-          });
-  }
-  // set a cookie to communicate the new sidebar state to the server
-  $.cookie('showsidebar', visible ? '0' : '1');
-  $('#sidebar').animate({'width': visible ? 'hide' : 'show'});
+  $('#sidebar-menu').toggleClass('col-md-4 col-any-0');
+  $('#main-content').toggleClass('col-md-8 col-md-12');
 }
 
 //----------------------------------------------------------------------