CSS Proposed 20 Years Ago Today

An anonymous reader writes: On 10 October 1994, Opera CTO Hakon Lie posted a proposal for Cascading HTML style sheets. Now, two decades on, CSS has become one of the modern web's most important building blocks. The Opera dev blog just posted an interview with Lie about how CSS came to be, and what he thinks of it now. He says that if these standards were not made, "the web would have become a giant fax machine where pictures of text would be passed along." He also talks about competing proposals around the same time period, and mentions his biggest mistake: not producing a test suite along with the CSS1 spec. He thinks this would have gotten the early browsers to support it more quickly and more accurately. Lie also thinks CSS has a strong future: "New ideas will come along, but they will extend CSS rather than replace it. I believe that the CSS code we write today will be readable by computers 500 years from now."

Comments

They _Should_ Replace It

[Anonymous Coward]

I’m sure this won’t be the only "css" sucks comment. I didn't like css when it first came out, I didn't like it when it became supported enough to use, and I still don't like it.

For styling and formatting it’s ok, but for layout it is a convoluted mess. Grid based layout is a standard of just about every UI engine for a reason we like stuff to line up, we like stuff to scale gracefully, and grid based systems work very well for both. "But.. but.. in html tables were made for text" I can hear some web dev whine. That doesn’t mean the whole concept of grid based layout should be tossed out and replaced by the clusterfuck that is CSS layout.

Simple things like a complex form, which would be trivial with a grid (and are trivial with tables) are an epic pain with CSS layouts. And what great benefit has it given us? Panels that float around the screen (and break if something is resized, zoomed in, or a block of text is larger than expected).

And detaching content from style epic failure. The oft referenced CSS Zen Garden is to me an illustration of exactly how CSS failed at this goal. The layout is still being largely defined by the HTML. You can only _somewhat_ adjust how things are positioned in relation to each other with CSS, which requires you to have multiple layers of nested <div id="random_section_that_you_might_use_for_something_or_not"> to give the kind of flexibility that CSS Zen Garden does. Actually take a look at the HTML for those pages. This is not an example of how things should be done.

Re:They _Should_ Replace It

[FictionPimp]

Using a fluid grid based css layout is faster, easier to write/understand/support, and a hell of a lot cleaner than tables. Having done web development for the last decade I have to say that tables for layout was a pain in the ass and a bad hack at best.

With html5/css3 almost all of your concerns are gone. In fact you can download a nice fluid grid based template in a second that can cut your table based layout development time into a 5th.

Check out http://www.getskeleton.com/ or even the often overused http://getbootstrap.com/

Re:They _Should_ Replace It

[itsdapead]

I’m sure this won’t be the only "css" sucks comment.

You missed the absence of any sort of variables/constants to let you (e.g.) assign a logical name to a frequently used colour or a standard indent width. Preprocessors like "less" are a great help, of course, but I can't believe a simple macro substitution facility or simple expression evaluation would have over-taxed even 20 year-old hardware.

Then there's the bizarre box model where the size of the contents, border, inner and outer margin are all conflated - even Microsoft's mis-implementation made more sense. Or the simple, but completely non-obvious incantations to make a div act as a container, or auto-clear floats. I still can't get my head around list formatting.

Basically, you're left with the feeling that the designers of CSS had never used a DTP package, never used styles in a wordprocessor package, never used a UI layout manager or, for that matter, ever seen a website.

TFS was also right on the money in one respect: a standard with neither a test suite or a reference implementation is no standard at all. The whole set of web standards suffers from the delusion that (maybe outside of pure mathematics) you can reliably specify a complex system without non-trivial exemplification.

Re:They _Should_ Replace It

[BarbaraHudson]

I believe that the CSS code we write today will be readable by computers 500 years from now."

If we're still using CSS 500 years from now, we're screwed. Heck, we better have something a whole lot better than web pages 500 years from now.

500 years? Look at what's come and gone in the last 50, and get back to me.

Wrong

[sootman]

"the web would have become a giant fax machine where pictures of text would be passed along"

No, we would have just kept using tables and <font> tags.

The tragedy of CSS

[tigersha]

CSS is good. Really. It is not too bad, has a few warts and so, but we are finally there. Or will be in 5 years when all the browsers finally support the new Grid layout module.

The problem with CSS is that it took 25 damn years to get to the point where windowing system were already in the 90s. There are 2 main problems up to now

First, the block model. Seriously people, if I specify that a block has a width of 300 pixels I mean that the block has 300 pixels, and not the content inside the block without the padding. Really. That makes no sense. For some reason it did to the authors of the standard. It hurts me to say this, but Internet Explorer 5.5 got this right and simply ignored the stupid, dumb standard. Most of the nightare that is CSS layout was caused by this clusterfck of stupidity. Now there is finally a solution, one can set the box-sizing and almost all browsers support it. Those that do not are old and can fly.

Secondly, tables vs grid. I get the whole tag is not semantic thing. Really. But often, strangely standards people, we DO WANT THINGS TO BLOODY LINE UP IN A TABLE. But nooooo, we must not use tables because it is not fashionable or something.

Floats were meant to be used to put pictures inside a large block of text. It is great for that. Now it is used for laying out elements on a page. And this is supposed to be LESS hacky than using a table? Seriously??

CSS grid layout finally, finally, finally solves all of this hacker bull. It does something that should have been in there since the 90s. After all, pretty much any window manage on the planet could deal with this back then. People still use tables because it is easier. Grid also decouples the sequence of the elements in the markup from the sequence on the screen, which is cool. But, but even Chrome only experimentally supports grid layout so I have to wait another 5 years.

A couple of other things on my wishlist.

Calculation. Based on the current state of the screen. Sometimes saying that I want the thing should be 500px - the width of the div with id #blabla would make a lot of all the CSS shenanigans unnecessary. Yes, I know that some designers can't add, but I can and I want to. And no, I do not want mathematica in there. Simple basic arithmetic would be fine. Right now you can do 3D transform in CSS3 but you can't subtract the width of an element??!! FFS why??!!! There is a new calc module but that will take another 5 yars to become commonplace.

Better control of height. I want to say "This div fills the rest of the container vertically/horizontally" One of the reasons tables are useful for layout is that you CAN do this by setting the width of a column to *. Layout engines in GUI land, such as Interface builder and the oooold News uses a concept called Springs which expand. Coool feature, missing from CSS.

The fact that you can book loads of courses and read lots of book on how to arrange things on a page with CSS is a real shame. It simply should not be necessary to have that level of expertise just to such a trivial thing.

25 years. This is the time from the end of WW2 to the day I was born (almost precisely). 25 years is the time between the invention of the transistor and the invention of the CPU. 25 years is the time between the first flight and the first ocean crossing over the Atlantic. 25 years is the time that someone goes from being born to being a working productive adult. 26 years is the time between Columbus' discovery of the new world and Hernando Cortes conquest of the entire Aztec empire.

25 years is a quarter of a century.

25 years is the time between the invention of CSS and the moment it is viable to lay out a page without being an expert in some very arcane hackery. Why was this really necessary??!!!