The Myth of CSS

I’m reading through the 63 comments on Matt’s code is food post and I inevitably got to one that mentioned that using CSS to separate content and presentation is a good thing.

I’ve made this argument myself a number of times, but in many ways this is a farce.

If you use CSS to apply the look and feel on your site, you have the benefit of being able to apply it to nice semantic XHTML. That part is great. That is the part we hear and fall in love with.

The ugly truth is this: almost all CSS/XHTML sites have their own version of :scare: tag soup :/scare: in a combination of extra DIVs, SPANs and BRs used purely for formatting and blocks that have to appear in a certain order for an effect to be applied properly.

There are limitations to what you accomplish with CSS alone; in many cases your XHTML has to submit to minor alterations for styling to be applied the way the designer intended. A true separation of content and presentation would mean you could make your changes purely in the CSS without making changes to the XHTML. Many times, that is not the case.

I remember chatting with Matt about a way to use DHTML to insert a DIV element into certain code that he wanted to use for styling. This approach is much closer to a separation of content and presentation than hard-coding the tag into the source, but it illustrates the symbiotic nature of the XHTML and CSS.

Using CSS and XHTML is a very smart way to build a site and there are a ton of benefits. When I recently built a new site from scratch, I built it as XHTML 1.1 compliant using CSS for formatting and I have no regrets. I plan to build all my new sites in this manner and eventually convert alexking.org as well. However, to say that I successfully separated the content and presentation using XHTML and CSS (respectively) is misleading.