Skip to main content
CSS is fun and cool and I like it.
Article

Centering List Items Horizontally (Slightly Trickier Than You Might Think)

Update April 2013: This article is pretty old. This isn't very hard. Just give the list centered text (e.g. ul.nav { text-align: center; }) and the list items inline-block (e.g. ul.nav li { display: inline-block; }). If you want to do it with margin for whatever reason, look into width: fit-content;.

The current standard in coding menus is unordered lists. It's not as semantic as a <nav> tag would be, but it's not that bad. Navigation is, … Read article

Article

Big Stories on Web Design this Month

This is kind of a Links of Interest post, but I wanted to highlight these things extra-specially:

A Preview of HTML 5


I know everyone and their mother is going to be linking to this article, and I also know this is potentially years away, but I can't help but get excited thinking about how sweet HTML 5 is going to be in production. For example:

<body>
  <header>...</header>
  <nav>...</nav>
  <article>
    <section>
      ...
    </section>
  </article>
  <aside>...</aside>
  <footer>...</footer>
</body>

How's that for … Read article

Article

How To Steal A Websites Background Image

Note: this should only be used for the powers of good! Don't go around stealing people's background images and using them on your own site without asking!

Many sites employ the use of a background image. They range from absolutely, unbelievably awful to simple and classy to downright inspiring. Since the image files that create them need to be kept in a public directory in order for them to work, they are accessible by anyone.

It's just a matter… Read article
Article

“Checkmark” Your Visited Links with Pure CSS

Due to user privacy issues, more modern browsers severely limit how you are able to style :visited links, which renders this article rather useless. You can read more about it here.

Web browsers know which links on a page have been visited by a user (until the cache is cleared out, that is). It is up to you the designer to take advantage of that web browser's knowledge, if you choose to do so. I'm sure you don't need to … Read article

Article

Links of Interest

If you come from a print background at all, one of the things you might sorely miss is the concept of "tabs". For example, think of a restaurant menu where the title of the dish is on the left, then a series of dots, then the price on the right. This is an age-old design technique used for leading the eye. It is accomplished in layout programs by setting up tabs and leaders quite easily. In web design....not so easily. … Read article

Article

More Information Regarding HTML Emails

Since I published my article on using CSS in HTML emails a few days ago, there has been a couple of great articles published on the same subject. I want to highlight some of these, and some other related articles that I didn't mention in the post.

Ensuring your HTML emails look great and get delivered
David Greiner has an article up on Think Vitamin which covers some of what I covered, but goes more into detail on actually getting … Read article

Article

My 5 Favorite WordPress CSS Tricks

UPDATE October 2012: This article is almost five years old. It contains a bunch of stuff I'd never do anymore. Rather than delete it, I'm going to update each section with better information. 1. em strong

Perhaps more than I should, I use the actual editor right inside WordPress to write posts. I have Visual Editor turned off, just because I like to see the tags of what I am doing. Also, I really hate that popup link window that … Read article

Article

Eliminate “Jumps” in Horizontal Centering By Forcing a Scroll Bar

You are likely aware of the page centering technique of adding auto left and right margins to an outer div:

#page-wrap {
  margin: 0 auto;
}

One of the shortcomings of this technique is that when used on websites with multiple pages, the layout can appear to "jump" a little bit when going back and forth between pages that require scroll bars and pages that do not. This is because the ~16px width of the scroll bar in the browser … Read article

Article

Links of Interest

If you've ever had to deal much with your `.htaccess` files, you know it's like learning a whole new cryptic language onto itself. It's high time someone made it easy. This online generator takes you through the options in plain English (or any of of 10 languages). Then it's just a simple copy-and-paste into the `.htaccess file` live on your server. Just an obligatory word of warning here: don't go fiddling with these just because you can, you can … Read article

icon-link icon-logo-star icon-search icon-star