Articles by

Chris Coyier

Founder, writer, designer, spam-deleter, email personality

#110: Quick Overview of CSS Position Values

This is a quick beginner-level overview of the different CSS position values. In a nutshell: relative allows you to “nudge” and leaves the element’s original position in the page flow. Absolute and fixed allow for exact placement of elements and …

(Updated on )

About HTML semantics and front-end architecture

Direct Link

Good read from Nicolas Gallagher. Among the gems:

Class names cannot be “unsemantic”. Whatever names are being used: they have meaning, they have purpose.

When Twitter Bootstrap first came out, I rewrote the compiled CSS to better reflect how I

Shop Talk Episode 10

Direct Link

Dave and I talk shop with Doug Neiner, whom I consider one of the smartest people I know. Doug is on the jQuery team and works for a company based around jQuery, so the topic of JavaScript comes up a …

Picturefill

Direct Link

Polyfill hero Scott Jehl has a new one for the theoretical <picture> element. The idea behind this new element is to solve the very real need to serve images of the appropriate size based on the browser window size. I’m …

ShopTalk Episode 9

Direct Link

Dave and I were joined by Ethan Marcotte and I bet you can guess what we talked about. That’s right ShopTalkers, it’s a full episode of responsive web design goodness, from the basics to the newer challenges developers are facing …

(Updated on )

LessMoney

Direct Link

I love Allan and Steve from LessEverything. I was just recently at my third trip to LessConf, which is a really fun web startup oriented conference. The fellas are at it again already, throwing a new conference called LessMoney. From …

Year Shortcode

For the functions.php file:

function year_shortcode() {
  $year = date('Y');
  return $year;
}
add_shortcode('year', 'year_shortcode');

Usage

Use [year] in your posts.…

Get Object Size

As in, the number of keys.

function objectSize(the_object) {
  /* function to validate the existence of each key in the object to get the number of valid keys. */
  var object_size = 0;
  for (key in the_object){
    if (the_object.hasOwnProperty(key)) {
      

Thinking Async

Here’s the rub: when you load JavaScript from a third party you should do it asynchronously. …

(Updated on )