Grow your CSS skills. Land your dream job.

Article Archives

Forums Now Have RSS Feed

It blows my mind that phpBB doesn't come with RSS feeds for forums. The new v3 is incredibly nice in so many other ways, it seems like it would have been a trivial addition for such a talented dev team. …

June 21, 20084 comments

Elastic Calendar Styling with CSS

This post was co-authored by Chris Coyier and Tim Wright of CSSKarma

A traditional calendar is a grid of numbered boxes on a page. As a web designer, you might go right for a table, and I wouldn't fault you …

June 20, 200815 comments

MaxSide: jQuery Plugin (and How-To)

Abstraction is an important concept in any language. You can think of CSS as a way of abstracting the design away from the content of a site. This makes the code for both much easier to read, understand and maintain. …

June 18, 200815 comments

Links of Interest

Enkoder

Worried about putting your email address right out in the open for all the world's spam bots to see? Enkoder will obscure it through javascript, yet be a perfectly useable link for everyone else. I tried to include mine …

June 17, 20088 comments

Yahoo’s Secret Text-Sprite Generator

Well I'm not sure if it's a SECRET, but it's certainly neat and I don't think they publicize it.

Basically it's a URL you can hit which will create a perfect sprite-ready PNG graphic of the text you include in …

June 16, 200827 comments

Absolute Positioning Inside Relative Positioning

A page element with relative positioning gives you the control to absolutely position children elements inside of it.

To some, this is obvious. To others, this may be one of those CSS "Ah-ha!" Moments. I remember it being a …

June 16, 200862 comments

From the Forums: Disappearing Background Graphics & More

Disappearing Background Graphics

Paul Smith posted about a weird CSS problem he noticed, disappearing background graphics. To quickly summarize, sometimes a DIV which is defaulting to the full width of the browser window, which also has a background image, …

June 13, 20089 comments

“Raw” Contact Forms (with CAPTCHA) from CSSKarma

Tim Wright from CSSKarma has taken my Contact Form and done some cool stuff to it. For one thing, the design is way stripped down so if you are looking to "start from scratch" with your form design, you would …

June 11, 20087 comments

Links of Interest

To Photoshop, or Not To Photoshop

37 Signals: We don't need Photoshop, we go right from sketches right to HTML.
Jeff Croft: Well, you have an established aesthetic which makes that possible. My clients tend to need …

June 10, 20084 comments

Hot off the Presses: jQuery UI v1.5 featuring “Themeroller”

jQuery UI version 1.5 was just released, and it's going to be a big one. For us designers and CSS coders, here are a couple of major highlights:

  • Class transitions (morphing): $("div").addClass("green", "slow"). So now instead of being able to
June 9, 20087 comments

Free PNGs for Creating Transparent Fills

If you have worked much with CSS opacity, you know that one of the most frustrating things about it is that by setting it on any page element, it forces it child elements to be transparent also. I …

June 6, 200819 comments

People Share Their CSS “Ah-ha!” Moments

A few weeks ago I shared my CSS "Ah-ha!" Moment and asked others to share theirs. It was lots of fun hearing what those moments were for people. I wasn't surprised to hear the CSS Zen Garden come up very …

June 4, 20089 comments

Links of Interest

Web Designer Diary

I (literally) Stumbed Upon this video of a web designer working on a website. It goes from a blank page in Photoshop to a complete and coded design in about 2:15.

 

Band Website Template (now…
June 3, 20087 comments

Create a Slick iPhone/Mobile Interface from any RSS Feed

We are going to create a web page that is formatted specifically for the iPhone (but would presumably be good for other mobile devices as well). This web page will dynamically fill itself with content from any RSS feed that …

June 2, 200840 comments

Using Flash And Staying Standards Compliant

Anyone who has ever worked with Flash on the web has likely come across the fact that embedding flash into a web page is usually no walk in the park. The code that Flash gives you to embed is something …

May 30, 200815 comments

Links of Interest

Designer / Not a Designer


I stumbled upon this hilarious animated GIF movie of a non-designer talking to a designer.

 

CushyCMS

Everybody and their brother is talking about CushyCMS lately. Probably because it's brilliant. It is a service …

May 28, 20087 comments

Part 2: Building a Unique Contact Form

I'm calling this Part 2, because last week I began this adventure over on Tutorial Blog where we first designed a unique contact form:

Photoshopping a Unique Contact Form

Here we are going to pick up where that left off …

May 27, 200839 comments

Sometimes For Your Own Sanity, You Just Gotta Say…

It's a long weekend after all. Have a good one everyone and stay tuned next week for some good stuff.…

May 25, 20082 comments

The CSS “Ah-ha!” Moment

I think it's different for everyone. That moment while you are beginner with CSS when something clicks. You just start to get it. That is your CSS "Ah-ha!" moment. You might not instantly become a CSS master, but from this …

May 23, 200864 comments

How To Design and Create a PHP Powered Poll

Polls are fun! They can help engage the readers of your site and give both you and the poll-taker valuable information. Let's walk through building a poll from scratch. All the way from the Photoshop design to the PHP / …

May 21, 200823 comments

Links of Interest

An Optical Illusion with CSS and Parallax

Marco Kuiper has put together a really cool optical illusion using the CSS parallax technique I posted about a while back. Check out his post and example. Make sure to resize your …

May 20, 20081 comment

HTML 5 vs. XHTML 2: An Article Roundup and Poll

Much like CSS3, widespread adoption for the next-gen web languages is a distant mirage. Still, it is important to stay educated on these things and even participate in these early stages while things are still malleable. Rather than re-hash everything …

May 19, 200820 comments

Twitter, New Screencast, 404

Tweet Tweet

I've been enjoying the Twitter thing more and more lately. Here is my Twitter page if anyone wants to follow. Just for fun, I've used some of that extra space down in my footer here on CSS-Tricks for …

May 17, 20087 comments

My Big Ol’ List of Design/Development, HTML/CSS and Personal Blogs I Read

I've had a few folks ask recently what other sites I read. Like many of you I suspect, I'm a bit of a junkie when it comes to design & tech news. I really enjoy popping open Google Reader and …

May 16, 200831 comments

How To: Resizeable Background Image

If you are looking for how to do FULL SCREEN BACKGROUND IMAGE, go here.

My friend Richard recently came to me with a simple CSS question:

Is there a way to make a background image resizeable? As in, fill …

May 15, 200884 comments

Links of Interest

Line Height Abnormal

Eric Meyer digs into some of the peculiarities of line-height:

Here’s the punchline: the effects of declaring line-height: normal not only vary from browser to browser, which I had expected—in fact, quantifying those differences was the whole …

May 14, 20082 comments

Redirecting to a Splash Page ( …but only once! ) with Cookies

Splash pages can be annoying. You know the ones... like being forced to watch some advertisement before you can see the page you are trying to get to. Or maybe some fancy introduction to a site that you are automatically …

May 13, 200818 comments

Sponsored Feature: Flipping Book

Flash can do some amazing stuff. Stuff that can leave even the handiest CSS and Javascript developer drooling with envy. We then sulk back to our caves because, alas, Flash is not the development path we have chosen. This is …

May 12, 20088 comments

Poll Results: What Javascript Library Do You Use?

...and the jQ's have it! At the time of this writing over 1500 people have responded to our latest poll "What Javascript Library Do You Use?" making it our biggest poll yet. jQuery is the run-away victor with over 50% …

May 10, 200814 comments

Launch: Band Website Template

Sorry folks, The Band Website Template has been discontinued. It was as great run, but we've decided to move on to other projects and clear up the time we spent maintaining and supporting this one.

I've been working on this …

May 8, 200820 comments

Toolbox CSS

Over on Tutorial Blog, I shared my "Toolbox CSS" that I like to use:

What is Toolbox CSS?

Toolbox CSS is styling information that has nothing uniquely to do with any particular website. These are a collection of common styles …

May 7, 200813 comments

Links of Interest

CSS Qualified Selectors


Shaun Inman has an idea for a submission to the CSS3 Working Group he is calling CSS Qualified Selectors. Definitely read the article to get the full low-down, but I'll summarize: this is a way to …

May 6, 20084 comments

How To Fix Video Slowing Down Your Page Load Time

I have a client who demanded an auto playing video on their homepage. Normally our job as designers is to translate our brain's first thoughts:

"OMG. WTF? Are you trying to drive people away never to return?"

Into something more

May 5, 200817 comments

From The Forums: Fluid, Fluid, Fixed & More

The CSS-Tricks Forums have been going very well since launch. It has only been just over a month and we have 130+ members and 660+ posts. Lots of great discussions have popped up and lots of folks have gotten the …

May 3, 20084 comments

Update on CSS Caching

There were lots of great comments on the CSS Caching article. I learned a lot from those comments, so I wanted to clear up some of the misunderstanding and highlight some of the great tricks other folks shared.

  • It
May 2, 20088 comments

Weather Switcher Updated

I wanted to post a quick note to let folks know that the Weather Switcher that me and David Walsh whipped up a while ago has been updated to actually work again. Yahoo made a slight change to how they …

April 30, 20084 comments

Links of Interest

Homer Simpson with Pure CSS


"If something's hard to do, then it's not worth doing." - Homer Simpson

 

Why Shit Matters To Design

"If you want to create work of significance, you need to create a lot of shit" …

April 30, 20082 comments

Better Pull Quotes: Don’t Repeat Markup

Pull quotes are wonderful. They can really draw a readers attention and they are a great opportunity for cool typographic work. On a blog though, pull quotes are particularly difficult to "pull off" (get it?!).
This is because of RSS. …

April 29, 200822 comments

Sponsored Feature: Web Resources Depot

I'm a junkie for web resources websites. I love browsing through them because I am always bound to find some example of something that sends my mind off on some tangent thinking about the possibilities. How can I extend it …

April 28, 20087 comments

Can We Prevent CSS Caching?

When you are developing a site, there is a heck of a lot of "refreshing" going on. You start to get a pretty good feel for what your browser is going to pick up on a single refresh, and what …

April 25, 200834 comments

IE CSS Bugs That’ll Get You Every Time

IE 6 actually had the best CSS support of any browser when it first came out... SEVEN YEARS AGO. The little bugs in it's CSS support still haunt us to this day. I still get comments from people who roundly

April 23, 2008102 comments

Links of Interest

NETTUTS Launches


If NETTUTS lives up to the quality standard of PSDTUTS, this is going to be a great resource for web design and development tutorials!

 

Q&A Formatting with Definition Lists


I wrote a guest article over at CSS …

April 22, 20089 comments

Improved Current Field Highlighting in Forms

VIEW DEMO

As a matter of usability and aesthetics, it is a good thing to add some kind of visual feedback on web forms to indicate the currently active (or "focused") field. Some browsers (Safari/Opera) have decided that …

April 21, 200826 comments

Talent Hunters and Job Seekers: Authentic Jobs

Authentic Jobs is widely regarded as the premier job board for web designers and developers. It is run by Cameron Moll who himself is an incredible designer. You can help support CSS-Tricks, and help yourself by finding talented people to …

April 20, 20081 comment

Fine Use for the Adjacent Sibling (“+”) Selector

My friend Richard came to me with an interesting problem yesterday. He was using some API of some kind that was returning to him a big list of companies. Each company had text, and most (but not all) also …

April 18, 200814 comments

New Poll: What is your Javascript library of choice?

I know I've been talking a lot about jQuery lately, but I promise I won't stray too far off the CSS path. I would like to find out what everyone else's favorite Javascript libraries, hence the new poll, "What is …

April 17, 200844 comments

Now With Archives!

There were pretty much no archives to speak of on CSS-Tricks before. You could browse by month and year (and I'll probably leave that alone for now), but that was a really crappy way to peruse the archives. Thanks to …

April 16, 20082 comments

Some Updated and Improved Examples

We are all learning and becoming better web designers and developers all the time. At least I hope we are, that is the whole point of this site! It is always a good idea to re-visit things from time to …

April 16, 200813 comments

Links of Interest

Clearing absolutely positioned elements fixes IE bug

The actual title of the article is "CSS - An Absolute Mess", but I retitled it here to something less linkbaity and more accurate. Nonetheless, a valid fix for something IE …

April 15, 20083 comments

Fade-in Spoiler Revealer

jQuery has some really simple built in features for "fading in" and "fading out" different page elements. I thought we could exploit some of those functions for a really simple Spoiler Revealer.

View DemoDownload Files

Between some …

April 14, 200825 comments

*May or may not contain any actual "CSS" or "Tricks".