Not talking about MathML here, but the addition of simple addition, subtraction, multiplication and division in CSS values.
By this time, I’ve worked my head around the idea that, to many developers (and clients) out there, CSS is the one true way and tables are only good for displaying data – that is, data that they consider data and not data that someone else might consider data. See my previous post on semantic html for more carping on this topic. But enough negativity – I would hereby like to add my voice to the growing number of developers calling for a new future in CSS: [paraphrase] “If CSS is the golden chalice of front-end web development, how come it can interpret between pixels, point sizes, and em sizes, but it can’t add 1 + 1?”
Now, I know, purists will say that Javascript is for math, and CSS is for styling. Just simply get a good Javascript library and do your math there. The problem is that other purists will say that using Javascript to generate your CSS positions is pure hackery. And yet other purists will say “everyone come to my website to check out my awesome CSS hacks!”
Let’s face up to it: there are some things that CSS is just not that good at. The idea that you are ruining your SEO by adding three lines of table code to get your column heights equalized seems dubious. But, I’m willing to go with that and check out some truly weird and wonderful tricks to arrive at the same solution that would take literally half a dozen lines of code using old clunky tables. But yeah, I’m sure google’s robots are completely fooled by a table and a couple of <tr> tags… [sarcsasm alert].
Anyway, if CSS is going to be responsible for our layout and can have access to and control some of the DOM, why can’t we just do:
#layerid {
width:20%;
margin:10px auto;
height:width * 0.5;
}
That would really open things up and allow for some more creative, interactive layouts. Hopefully, CSS 4 will allow for some of this. It should be, in my opinion, a no-brainer.