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 the background of a web page edge-to-edge with an image, no matter the size of the browser window. Also, have it resize larger or smaller as the browser window changes. Also, make sure it retains its ratio (doesn’t stretch weird). Also, doesn’t cause scrollbars, just cuts off vertically if it needs to. Also, comes in on the page as an inline <img> tag.

Wow, that’s a tall order. My first thought was… uhm, No. But of course this is just the kind of challenge I enjoy, so I set about to thinkin’. Ultimately, I found a pretty good solution and we turned it into a pretty neat little project. First, check out the finished project, then I’ll show you how it was done:

Finished Project: What’s The Weather?

Read Article / Comment »

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 point—but they also vary from one font face to another, and can also vary within a given face.

Setting a Body ID (with PHP)

I’ve mentioned the powers of giving your body tags an ID about a million times here on CSS-Tricks, so I figured this was highly appropriate. Trevor Davis shares his technique on how he sets this using PHP. Basically it analyzes the URL to see what sub-directory you are in and sets it based on that.

YCodaSlider (v2.0)

My favorite jQuery-based “slider” has gone v2.0.

Yes!

Instant Rimshot & Sad Trombone

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 redirected to every time you visit. Great.

There are some circumstances where a splash page can be useful. Say you are running a band website and they release a new album. You may want to redirect people visiting to a splash page introducing the new album. This might even be welcome by the bands fans, who would want to know about it and have the opportunity to buy it. But, they certainly wouldn’t welcome it the 5th time they went to the site and were re-directed.

Let’s fix that!
Read Article / Comment »

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 a foreign world who’s amazing feats are out-of-grasp lest we start learning a whole new development environment from scratch.

One of those drool-inducing Flash feats is Flipping Book. This is an amazing Flash object which mimics the behavior of a book laying on a table. You can literally grab the corner of a page and flip the page with some absolutely kick ass animation.

Read Article / Comment »

…and the jQ’s have it! The 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% of the votes. What does this mean? Just that the beautiful and intelligent readers of CSS-Tricks have a tendency to lean toward jQuery. However, since this site is largely design focused and there was the whole other 50% of votes for the other libraries, I wouldn’t be surprised if a survey on a more developer-based site would yield different results. Here is the breakdown:

MooTools and Prototype were battling for 2nd place with MooTools ultimately taking the lead. I wasn’t surprised to “whichever” with a fair number of votes. That was certainly the boat I was in for a long time. Spry and YUI and the others didn’t get many votes but certainly have their supporters (more power to ya).

I obviously love jQuery and will continue to use that when the situations arise in tutorials here on CSS-Tricks. But I am only one man here and it’s a big internet. You should use whatever you feel most comfortable with.

I’ll leave the poll up for a little while longer if you have yet to weigh in. Then we’ll figure out some other fascinating poll idea. Ideas welcome in the comments!

NEW: I put up a page where you can see all the past polls, and actually still vote in them if you choose. Check out the new CSS-Tricks Polls Page.