Changes 3/5/15 - Blogger CSS and Code Highlighting

So today is a snow day, but I was messing around with blogger and figured out how to set custom, blog-wide CSS classes. So now, if I have some code I'm referencing, and I don't want to pull it out into a Github gist, I can use my fancy new <span class='code'> tags instead of having the old <span style='font-style: monospace;'> that I've been using. Not only is span.code less typing for me, but I also made it much fancier.

span.code {
  font-family: monospace;
  color: rgb(234, 85, 31);
  border-radius: 1px;
  background-color: rgb(239, 239, 239);
}

I also made a CSS <pre> class (as you can see above!), but I probably won't be using it as much because most of my longer code blocks will be put into gists.

	pre.code {
	border: 1px solid #919191;
	color: rgb(153, 58, 23);
	padding: 2px;
	padding-left: 10px;
	border-radius: 2px;
	}

view raw blogger_pre_code.css hosted with ❤ by GitHub

Thanks, Github! Even though your css syntax highlighting is kind of ugly.

I was able to do this in the Blogger menu. I went to Template > Customize > Advanced > Add CSS.

Actually, I probably should have just gone there first, but I checked out Sam's blog, and he's using <code> tags, which would be even less typing than <span style='code'>!  I didn't even know that tag existed, and it looks like it's default style is to set the font-family to monospace.  So I've been typing out <span style='font-family: monospace;'> all this time for no reason.