Zach Holman

CSS is a funny area. It's almost unique in that no matter which level you're at, there always seems to be something you're learning, some new technique to consider, or some new frustration out there. Every time. When you're first learning, you grapple with the concept of using another file to style your entire site, and then you try to grasp the concept - and validity - of tableless design, then you go for cross-browser compliance, and then you're stuck running into strange cases every now and then.

For example, tonight I was doing a few things I really hadn't done before, and it really makes you think about the limitations of CSS and its future. The layout I was working on tonight was a horizontally centered fluid layout with some left and right margins. I then wanted to have a thick border on the sides, and then give it a subtle shadow on either side of the layout to give it some pop. On top of it all, let's throw in some rounded corners that fit within that thick border up top.

It's difficult to do. Most of the solutions out there relied upon making a large background image to take care of the top and left borders, but that's not really scalable and isn't quite as elegant as I had in mind. For a fluid layout it really doesn't work very well- the alistapart.com rounded corner/border article was more directed towards smaller boxes within the content, not the entire layout itself. In order to get it the way I wanted it, I needed to nest two divs, throw small repeated background images for both to handle the border and shading and bump padding in there so one div doesn't overlap the other. The top curved corners were also challenging- I had to again do two nested divs and sort of squeeze all of that within the top border.

Yes, it's complicated, and, as I'm sure that it's readily evident at this point, it's really confusing to type out and to read (my apologies). But basically, I ended up having to add another couple divs in order to account for a fluid layout with multiple background repeated images. That's just not cool. It's not a logical layout code-wise, and I could see it potentially biting me in the butt later down the line.

So where does this put us with CSS? CSS3 is supposedly going to bring a number of improvements (the shading aspects, from what I've seen, would help me out), but if you try to estimate the time it will take before developers can really utilize that new technology- well, it will be quite some time. Adoption rate is just really hard to deal with in regards to new standards on the web. And then you're sort of in a catch-22: why code for CSS3 standards when no one has browsers to support it yet? Why upgrade your browser if no one's really doing anything groundbreaking with CSS3?

Okay, so it's a dreary outlook, but I'll say it anyway: the future for web design doesn't look to be as exciting as we'd hope. IE7 isn't a glorious gift to mankind from the Microsoft gods- we'll still be bug fixing for the forseeable future, really. The current CSS specs aren't as flexible and rich as we as developers would like to see them. Designing a new site can be a real bitch.

At least the silver lining is that when you're finished up, you can look at your cross-browser layout with pride. And it's also such a joy to look through the CSS gallery sites to see what people can still do, even with all of these limitations we face. There's my little gripe for the night. :)