Monday, 16 April 2012

Conditionally hiding the sidebar on Blogger

I've recently added a small bookstore to this blog, as I thought my readers might be interested in the books I find interesting and useful. You can access it via the link in the bar above this post. If you open the "Bookstore" tab above, you'll notice that the right sidebar isn't present there, yet reappears when you reopen the "Blog" tab. This is achieved by a inserting a bit of CSS magic at the top of the HTML of the Bookstore page:

 <style type="text/css">   
  .main-inner .columns {padding-right: 0;}  
  .main-inner .fauxcolumn-center-outer {right: 0;   
  _width: expression(this.parentNode.offsetWidth -   
  parseInt("$(main.column.left.width)") + 'px');}  
  .main-inner .fauxcolumn-right-outer {width: 0px;}   
  .main-inner .column-right-outer {width: 0px; margin-right: 0;  
  display: none;}  
 </style>   

Credit to the greene teapot blog for this little gem!

No comments:

Post a Comment

Please leave a comment if you find this blog helpful or interesting! I'd love to hear from you!