dane-m
11/20/2014 - 5:11 PM

Target all pages except home page with not selector in scss

Target all pages except home page with not selector in scss

/*
  http://www.reddit.com/r/Wordpress/comments/2moqec/great_use_case_for_css_not_selector_when/
  
  So I'm working on a client site just now and I was trying to think of the age old problem of how to do the page layout
  (content | sidebar) without applying that same layout to the homepage. If your home page is set to a static page, you 
  can't use body.page{} because the home page is still technically a page. 
  
  You could overwrite all the styles for body.page.home{} but then you're repeating yourself. Then it hit me, use the 
  CSS :not pseudo selector!

  So in my .SCSS file, I had something like this...
*/

body.page:not(.home){
    #primary {
        width: 70%;
        float: left;
    }
    #secondary {
        width: 30%;
        float: left;
    }
}