Why did I not know about this?

(Courtesy of HTML5Rocks)

As it turns out, there is a calc() property of CSS. Wait, property is that the right term ANYWAYS.

It is something that I have wished for on many previous occasions. The ability to mix units. Now, if you want something placed at 10% plus 15px left, you don’t have to do something odd like left:10%; margin-left:15px;, you can just do left:calc(10% + 15px); Quite useful!

Well, okay, you can’t do it quite that easily. It’s an experimental thing, so you have to do some tinkery bits with it. Firefox and the current dev build of Chrome support it, you just need to drop in a -moz- and a -webkit- tag in front.

Inexplicably, IE9 has full support for it without any sort of tag dropped in front. How odd.

Calc() can be used for addition, subtraction, multiplication, and division. +, -, *, and /. I’m looking forward to this.


I’ve been following this guy’s blog in Google Reader for a while, and for some reason a whole bunch of RSS updates just went through. I suspect it has something to do with his having redesigned and redone just about everything. Anyhow, it’s a really interesting design – lots of 3D fanciness.
Read more


Yesterday, I did a little review-thing of Code Year. I mentioned the site behind them, and plans of doing a little review-thing of them. Yes, I know, surprising that I’m actually following through with some plans. I am rather bad at it.

Read more

Code Year

My plan to start posting on the 1st didn’t work. Whoops.

Code Year: haven’t got a resolution yet? Wanna make one? Resolve to learn to code a bit better. Pretty simple, they’ll apparently email you a lesson once a week. I’m signed up for it.
Read more

Quota Management API – HTML5Rocks

While it’s not actually totally finished, I’m really excited about the Quota Management API. I’ve been working with offline web storage things a bit lately (for some reason, IndexedDB is really confusing for me…), and the idea of being able to ask the user for more storage like you can with Flash storage is very exciting. 
Read more


-prefix-free is a useful little script, just include it in your code and it’ll get rid of the need for prefixes. You know, those annoying little things you have to use for your fancy CSS3-things. Examples include -webkit-, -moz, -o-, and -ie-.

Check it out here.

Subtlety in User Experience

I’m filing this under CSS(3), because it’s really a visual thing, and we all know that CSS is the most important tool in a web designers arsenal. Or something like that.

Subtle little things are incredibly important in user experience. Not as important as, say, making sure that everything is readable, or can be clicked, or such huge things. But still, important. People tend to notice the small things. cursor: pointer versus cursor:default makes a huge difference in the user’s experience. Well, that example doesn’t do a whole lot for mobile devices, but when people are using a desktop/laptop/netbook/device-with-a-cursor, our minds are well and truly programmed to take that little pointer finger to mean ‘this does something’.

And it isn’t just the way the cursor looks. Take a look at the latest version of MS Word for Windows: the topbar has incredibly subtle highlight effects when you mouse over. Not an obvious thing, but it helps the user know what is going to happen if they press their mouse button at that moment.

Basically, just remember that the little things count.