Treehouse: Grow your CSS skills. Land your dream job.

Article Archives

29 comments

Styling Scrollable Areas

The scrollbars on browser windows are not styled by the website itself, or even generally by the browser. They come from the operating system itself.

The desire to customize the style of these scrollbars is strong. When you are starting …

10 comments

Lifestream Website with Sweetcron

I wrote a tutorial for NETTUTS that has been published:

Sweetcron is "The Automated Lifestream Blog Software". It is still in public beta, but is already a very nice blog software package. The beauty of Sweetcron is that new posts …

38 comments

Body Border 2: Fade In with Gradient

A while back I showed you how to create a Body Border with CSS. Basically, we used four fixed position DIV's to ensure all edges of the screen got a border and that the border would sit on top of …

8 comments

Links of Interest

Test Your Color IQ

I would think designers would be better at this than most folks. You can test your color IQ by arranging blocks of color into hue order. There are 20 blocks per row and the hue change …

29 comments

Drag ‘n Drop Cards

In the next week or so we are launching refreshed site for one of our clients at Chatman Design. The client is Beacon Athletics, a company that sells equipment for athletic fields. The homepage is of course of particular importance. …

18 comments

A Business Card Microformats Site

All microformats are are standardized ID and Class names to wrap data in. Really. That's it.

Say you are having a birthday party next week and you are posting about it on the web. That event has a name (Birthday …

15 comments

Will Font Embedding Ever Become A Reality?

I have to admit I don't have my head fully wrapped around this whole font-embedding controversy. At it's root, it comes from us web designers being frustrated by the lack of options font options for our web pages. We want …

5 comments

Links of Interest

IE 8 Proprietary CSS Attributes

IE 8 will have a number of proprietary CSS attributes. Not a big surprise, all the major browsers have them. It's a way to have support for a) stuff that is truly proprietary to …

29 comments

Screencasting Setup

I get a fair number of questions about how I record the screencasts, so I thought I'd do a post on it that is both of interest now and that I can refer people to later. …

8 comments

From The Forums

Yesterday I "upgraded" the forums from phpBB 3.0.0 to 3.0.2. It was a bit of a debacle, probably mostly my fault, and it was down for a lot of the day. It's back up and running now though! Apparently it …

21 comments

Messing With Firefox’s View Source CSS File

Firefox has a number of core CSS files that it uses to render web pages. Most of them are filled with sensible default values for all those pages out there which don't provide their own styling. For example, Firefox has …

10 comments

Links of Interest

Tutorial Search

When I was doing that video on Google Search I thought to myself wouldn't it be cool to make a search engine that only searched through design/development sites? I talked myself out of it, because I started …

8 comments

How To Deal With An No-Longer-Semantic ID or Class Name

Errol writes in:

What's your thoughts on a situation where you've started
naming classes and then halfway through you realize that
you need the same class but the naming isn't semantic.

Do you create a duplicate class, rename the existing …

25 comments

Improving the Default Directory View

You've all seen a page like this:

That's when you are viewing a directory on a server (or locally), that doesn't have an "index" page to show you, but does have permissions set to allow you to see the directories …

5 comments

Links of Interest

Fade Out Bottom (revisited)

The first post that was ever popular on CSS-Tricks was my tutorial on fading out the bottom of a website. Reader Pascal Moret wrote in with some suggestions for fixing it up for IE 6. …

91 comments

IE 6 Blocker Script

Fed up with supporting IE 6? Ready to just cut it off? I don't blame you. I generally feel that most problems people have with IE 6 are pretty easy to work around with practice, but that is not always …

32 comments

Launch: Status

Today is the unveiling day of a new web application I've been working on the past few months. I am pleased to announce: Status. I worked on it with my friend Richard of Shiftedfrequency.


What is Status?

Status

20 comments

Links of Interest

Automatically back up your entire web server files and databases to Amazon S3

Christina Warren has a comprehensive and excellent tutorial on creating a Ruby script to back up your entire web server, including databases, and upload them directly to …

48 comments

Date Badges and Comment Bubbles for Your Blog

One of the things you run into when your blog becomes bigger, is that you need to cram more info into less space, to make it possible to display all the information you want to show. One of the things …

12 comments

Screencast Archives Updated!

It was a long and grueling process, but I finally finished updating the entire video archive. Here are the improvements:

  • Videos play on the web in Flash. From time to time I would get a note from someone either saying
62 comments

New Poll: How Do You Back Up Your Websites?

What if you hosting provider calls you one day and tells you they had a catastrophic fire at their facility and every bit of data on their (your!) servers is gone!

It's highly unlikely, of course, and it's more likely …

3 comments

Links of Interest

Google Docs: Forms

This isn't exactly breaking news, but I only just heard about it so I thought I'd share. The free service Google Docs allows you to build web forms from within it. It has a pretty limited feature …

32 comments

Poll Results: What is your favorite CMS?

WordPress was the clear winner in the most recent poll asking What is Your Favorite CMS?

I'm a bit surprised there weren't more people commenting that WordPress isn't really a CMS (which I disagree with). WordPress had more than …

4 comments

Links of Interest

Want More Sales? Become an Authority

This latest article from Search-This, Thinking Outside the SEO Box, is about small-guy eCommerce stores and what they really need to do to compete in the ever-saturated online store space. The main advice? …

7 comments

Links of Interest

Finding Information: Factors that improve online experiences

As this site grows, my concerns about the findability of information grows. I feel like the navigation is fairly clear (although sub navigation is lacking). I have browseable archives and search, yet still, …

21 comments

Label Placement on Forms

When creating a web form, one of the many choices you must make is how you are going to align your labels with your inputs. This is not a trivial decision, as this placement affects the readability/usability of your form, …

13 comments

Launch: Script & Style

I always liked the idea of having a community links section on websites. Lots of sites in this genre have that and I think it's great. The driving purpose behind a tutorial site like this is helping people learn and …

3 comments

Links of Interest

Favorite Design-Related Sites of 21 Designers

Steven Snell of Vandelay Design launched a brand new site called Designm.ag which is "articles and resources for designers". I participated in a group interview post where a bunch of designers list some of …

49 comments

Removing The Dotted Outline

Anchor links (<a>'s) by default have a dotted outline around them when they become "active" or "focused". In Firefox 3, the color is determined by the color of the text. I believe in previous versions and in some other browsers …

54 comments

Easily Password Protect a Website or Subdirectory

Working on a website that you need others to see, but not the whole world? Password protecting a website (or a sub directory within a website) is actually a pretty easy thing to do.

11 comments

Links of Interest

Bit.ly

URL shortners have been around for a while, so it's nice to see there is still innovation being done. Bit.ly offers all the standard features of a URL shortner, but includes compelling new features like click/referral tracking, automatic page …

114 comments

Designing for WordPress: Complete Series & Downloads

Over the last few weeks, I have been been doing a video screencast series on Designing for WordPress. It is a three-part series which covers downloading and installing WordPress on a server all the way to a completed theme.

Part

83 comments

Why People Still Use IE 6

Internet Explorer 6 is always a hot subject of debate. We've talked about it here many many times. The forums are full of folks trying to troubleshoot it. The CSS support is problematic and the JavaScript support is proprietary nonsense. …

60 comments

How To Create a Horizontally Scrolling Site

If web pages were made out of wood, the grain would be running up and down. Vertical is the natural flow of web layout. When page elements reach the right edge of the browser window and go over, the flow …

10 comments

Image Map with Prototype Tooltips

The areas inside of regular ol' HTML image maps support the title attribute which makes regular tooltips possible. Sometimes the default browser tooltips just don't cut it, especially with their built in delays.

My favorite package for doing fancy tooltips …

68 comments

The Difference Between ID and Class

ID's and Classes are "hooks"

We need ways to describe content in an HTML/XHTML document. The basic elements like <h1>, <p>, and <ul> will often do the job, but our basic set of tags doesn't cover every possible …

8 comments

Links of Interest

Best of June 2008

Noupe with another very nice monthly roundup of good design-y stuff around the web last month. I like these giant monthly roundup posts. Gives a good monthly goal of trying to write things that are worthy …

5 comments

Featured Review: Markup Factory

It would be fair to call Markup Factory a CMS (Content Management System), but that would be cutting it short. Markup Factory is much more that, but be scared or think for a moment that it's "over your head". It's …

17 comments

4th of July, Happy Birthday CSS-Tricks!

Today is the 232nd birthday of the United States and the 1st birthday of CSS-Tricks!

Been a great year! This blog and this community have helped me grow tremendously. I'm sure the next year will be even better …

28 comments

Cutting Edge Browsers and Their Development Tools

This is a hot time in the world of browsers. Despite a rocky morning, Firefox 3 got over 8 million downloads when it was released. It's up to over 24 million now. I bet many of you are amongst these …

10 comments

Links of Interest

Students: Are you going to be employable?

Andy Rutledge's article The Employable Web Designer is about how schools may not be properly preparing students with actually employable web skills:

These students are worried that they’ll emerge from school without marketable …

9 comments

Poll Results: Which Next Gen Web Language?

Surprising results again, at least for me. "Don't Care - As long as there isn't a standards war" was actually in the lead for a little while, but was ultimately beat out by "XHMTL 2".

I …