CSS Doesn’t Bug Me
John C. Dvorak has written in his PC Magazine column (found via hicksdesign) that CSS is fundamentally broken. This is so far from the truth I can’t believe it’s actually been written in an actual magazine. Although the columnists task is sometimes to provoke you into think about things, so writing it in the first place is fair enough.
Apart from a failure to grasp exactly how CSS works (huh, maybe that’s why you’ve struggled in redesigning your blog John?) he highlights what I consider to be a major problem with the majority of people who work with CSS, rather than CSS itself. John complains that each browser’s implementation of CSS is different, and that
“There actually are Web sites that mock this mess by showing the simplest CSS code and the differing results from the three main browsers and the Safari and Linux browsers. The differences are not trivial. And because of the architecture of this dog, the bugs cascade when they are part of a larger style sheet, amplifying problems. Worse yet, nobody except the most techie insiders wants to talk about this mess.”
There may well be websites that show these problems. I know there are ones that will show the differences in implementations between browsers are the very least. There are generally two schools of thought on this. One is that if you follow standards and your designs look correct in a browser that follows the standards then you can leave it. The other is that you shouldn’t bother with CSS for layout, or even standards at all. Just use tables for layout.
Both of these are just plain wrong, strangely, for the same reason. That reason is that you are assuming everyone is using the same browser as you are, and that your browser is correct. Nearly all browsers are wrong to at least some degree and you have to take that into account and find where they all get it broadly right.
The most important thing when doing a design for the web is that it will look consistent on, and work on as many browsers as possible. To fail to do so is to ignore a potential customer, reader, whatever. In standards mode, most browsers will display things in a relatively consistent way. However because Firefox and IE treat floats, for example, in different ways then using these may result in uneven results. If you’re not following standards then you’re just making it harder for yourself because in quirks mode different browsers get even more things wrong. Firefox, for example, will emulate old Netscape bugs to make sure old pages will look the same as they did in Netscape. The answer to this problem is that in standards mode, it is normally possible to achieve an effect another way that will render consistently across browsers.
So then, CSS. CSS is good. Seperating your presentation from content is wonderful because you can fiddle about with the design, reposition things, change fonts all in one location. I think the problem that John has, looking at his blog, is the CSS file he’s started off with to do his design. I can see from the code he’s using Wordpress, like me. What he’s probably found, like me, is that the CSS is badly commented and rather horribly laid out. Some elements have styles defined in more than one place, and sometimes the same property set to more than one thing. It’s a complete nightmare to try and follow and modify. You make a change and nothing happens, because the property has been overriden later on. I think this proves it’s possible to write CSS that is harder to follow than if it had been done inline in the HTML, but don’t blame the technology for that, blame the guy who wrote it originally. Sure, it made a great looking design, but it made it near impossible to make some simple changes, which completely defeats the points of CSS in the first place. CSS is the best answer to the problem of presentation though. Maybe we just need to get some standards on good ways to write it…
I need some help with the Asktheseguys wordpress theme..
I can't figure out how to get the header and ad bar at the top to go all the way across the screen.. Or better yet, how I can place an ad box in the empty space at the top right.
I can usually figure this stuff out easily, but can't find anything in the CSS that will make it work..
Anyone have any ideas?
Hi Allan, can you provide a link to the page you’re trying to edit the theme on?