Written by Chris Coyier from CSS-Tricks on February 29, 2008

If your blog has well-written and informative articles, like any good blog should, you should probably have a well-formatted print stylesheet declared. Just like your regular “screen” CSS controls how your webpage looks in a browser, the “print” stylesheet controls how your webpage prints on a printer.

First things first, you need to declare the stylesheet:

<link rel="stylesheet" href="print.css" type="text/css" media="print" />

Alternatively, you can pack all your “media styles” into one stylesheet, which is efficient as it reduces the number of server calls your page needs to make. Within a single CSS…

Filed Under CSS / 3 Comments
Written by Chris Coyier from CSS-Tricks on February 22, 2008

If you Google “stop image theft“, you will get some results of some really bad, non-effective ways of preventing image theft. Things like “disabling right-click” with JavaScript. Crippling usability is never good, especially when it will barely even slow down someone determined to steal your image. This is kind of like strip searching kindergardeners because one of them brought a knife to school once.

There are two different types of “theft” of images. One type is direct “hotlinking” of the image. That is, displaying the image on a third party website…

Filed Under CSS / 8 Comments
Written by Chris Coyier from CSS-Tricks on January 25, 2008

One of the many, many smart things that WordPress does is apply the ID of posts to the div of that post. Most themes leave this intact, although I have seen some themes that remove it. This is how the container div for posts should look like:

<div class="post" id="post-<?php the_ID(); ?>">

One of the reasons WordPress does this is for linkability. ID’s have that special ability to “skip down the page”, so if you wanted to link to your homepage, but make sure it skips down to a particular post, you…

Filed Under CSS / 1 Comment
Written by Chris Coyier from CSS-Tricks on January 18, 2008

If you’ve ever included snippets of code on your blog, you know that presenting that text can be a unique challenge. HTML provides a tag for this purpose, the <code> tag. Unfortunately, just chucking your code in those tags isn’t the end-all solution. For one thing, you typically need to turn off your Rich Text editor and hand-write them in if you want to get those tags at all. For another, if you are including actual HTML code in your sample, those tags will still render as HMTL, not text.

What…

Filed Under CSS / 5 Comments
Written by Chris Coyier from CSS-Tricks on December 28, 2007

Commenting your CSS is simple, just put them in between “/*” and */”, like so:

p {
   font-size: 1.3em;  /* Font size for main content */
}

That’s a single line comment, but you can do multi lines just as easily:

/*
  Blog Design Template Author:  Chris Coyier
  Authors Website: css-tricks.com

  Feel free to use, share, or alter this
  template in any way.
  Links are always appreciated.
*/

There are many different schools of thought on the use of comments. On one extreme, some people think they are just a waste of time and…

Filed Under CSS / No Comments