txt
Jan 8th / Friday / '10

disassembler-deactivated2011041 asked: Got another CSS question (more specific this time): The bg-color for the sidebar on my website is #fff, and the homepage has a tiled background, so it shows up. The bg-color for all other pages is #fff, so it doesn't show up. What declaration can I use to change the bg-color on all other pages, and keep it the same on the homepage?

for that you would use a unique ID on a top-level tag, like body or use a div that encases the whole page. then, in your CSS, you can make page-specific rules by this identifier.

examples:

#index { background-color: #999; }
#about_me { background-color: #222; }
#about_me #sidebar { display: none; }
#about_me #content { width: 100%; }

the second one isn’t recommended, but it’s just to illustrate what you can do with it.

you can see a working example of this on danmeth.com.

if you’re running entirely on tumblr, and using posts as your subpages, then the tag of the post is your identifier. i don’t think i was able to get it in the body tag, because it’s within a block, but did make a page wrapper that worked fine:

{block:TagPage}
<div id=”{URLSafeTag}”>
{/block:TagPage}

if it’s a static site, hardcode the ID into the pages. other situations require different ways of accomplishing this, but the ultimate goal is to always have a unique ID in the body tag.