Little-Known CSS Facts
sitepoint.com
sitepoint.com
You can create elements that maintain their aspect ratio using width:100% and padding-bottom:100%. Unintuitive, since you wouldn't expect padding-bottom to be based of the width.
http://stackoverflow.com/questions/1495407/css-a-way-to-main...
The amount of time we spend fighting with CSS to do things that are simple is insane.
The web is not a well-designed platform. It grew organically out of a document system under the stewardship of a million browser developers with no leadership, and it shows. It's a series of hacks upon hacks upon hacks that only make a reasonable, decent computing platform by the combined might of the entire software industry making tools and frameworks and JavaScript optimizing compilers and whatnot for it.
Hindsight is 20/20, and it would have been difficult to foresee that the web would become an application platform in 1994, when the concept was being introduced to the web. CSS was primarily intended as a specification for styling documents, and not for implementing application layout - I would wager that most of the objections actually focus around it's unsuitability for this role.
That said, it's obvious that CSS is not currently optimal for the use cases that emerged. That's why we've had so much work on new versions, which attempt to solve some of the long-standing objections. From my perspective as a developer, it's working relatively well; even minor changes in the general availability of things like border-box sizing have made a huge difference to the ease of doing application layout in CSS, and the situation only continues to get better.
To be fair, some of CSS's shortcomings follow from HTML design errors that are equally egregious (and in some cases have been magnified by HTML5). E.g. It ahould have been possible to create decent looking navigation elements in HTML with no CSS or Javascript, but still isn't.
These features are all now available in the latest CSS specs. Yes, it's taken a while to get there, but I absolutely dispute that these features are "obvious."
To be fair, some of CSS's shortcomings follow from HTML design errors that are equally egregious (and in some cases have been magnified by HTML5)
I don't in most cases agree that problems in HTML are "design errors," so much as "features it turned out we wanted that we didn't think we did."
E.g. It ahould have been possible to create decent looking navigation elements in HTML with no CSS or Javascript, but still isn't.
Again, I don't agree that this is something HTML should be involved with.
All the layout features used in applications are obvious requirements for web applications.
It's perfectly reasonable to leave out a lot of stuff from early versions of a product or standard, but we're a long, long way past that.
> I don't agree that this is something HTML should be involved with.
HTML is involved with it, it's just badly involved. Either don't provide presentation controls or do it properly. Your opinion doesn't matter because there are facts on the ground.
Okay, but CSS was a document layout spec for web documents, and has become to be used as a layout spec for interfaces. There are differences there - in other words, CSS is pretty unique in terms of the kinds of areas it has been trying to tackle. Say columnar text - I don't at all think that many people would have considered that it would be required back in the early days of the web. It turned out people did need it, and now we mostly have it.
So no, I don't think many of the things you talk about were obvious, and in any case we've mostly sorted the situation - it's taking a long time, but CSS is also special in that there are lots of implementations of it, and many of them are legacy. So don't expect overnight change.
HTML is involved with it, it's just badly involved. Either don't provide presentation controls or do it properly.
HTML was historically involved, because we didn't realise how important separation of structure and presentation would actually turn out to be. Now we're got a big legacy to deal with.
To be honest, I'd have preferred XHTML2 won, but I don't really think it's a massive deal either way - you're arguing for perfection, which exists in literally no software platform.
Your opinion doesn't matter because there are facts on the ground.
I'll leave you to think about the irony of that statement, and just point out that facts are open to interpretation.
Positioning is another fundamental topic that is hard to learn without really taking a close look. It's not glamorous or new, but I think a lot of people (myself included, until recently) don't fully understand how positioning works. A List Apart has a good article on the subject: http://alistapart.com/article/css-positioning-101
In the same vein, another good topic is selectors. They're quite powerful, but if you only ever look at simple styling examples, you'll never really be exposed to their breadth and power. Check out the docs: http://www.w3.org/TR/CSS21/selector.html
There's a CSS clip property? And a collapse toggle? holy shit.
This is really cool, thanks!
edit: hmm, a few refreshes fixed it up.
text-decoration: blink;
(Doesn't actually seem to work in Chrome. Here's a CSS animation alternative: http://stackoverflow.com/questions/13955163/imitating-a-blin... )
Example: http://ryanrussell.me/404
setInterval('for(v="visibility",b=document.querySelectorAll("blink"),a=b.length;a--;)c=b[a].style,c[v]=c[v]?"":"hidden"',999)