While I agree with the need for this for desktop applications, there are some real issues with it for web sites. Namely, lining up graphics.
Anyone who develops intelligently already tries to define all measurements in ems. Ems are resolution independent, and have great accuracy (3 decimal places).
However, if you want to develop any relatively complex visual design, you will end up with slices, and those slices must line up perfectly. Except, when using relative measurements and scaled graphics, it doesn't always work out. Many sites when scaled end up having weird graphic glitches, especially when using CSS sprites.
The solution is several-fold:
- We need to get the CSS border-image working in every browser. This single-handedly could change the ability for designers to work with more advanced layouts. (We wouldn't even need box-shadow anymore, since an all-black alpha-transparent PNG is very, very small, even if it is huge pixel-wise.)
- We also need better layout components in (X)HTML. Currently, the only way to build a web app is with tons of JavaScript manually performing layout. It feels like I am developing code for the late 1990s. We need boxes we can layout using relative positioning, that takes into account both width and height of the parent component. The box model has some incredibly frustrating choices — like basing the width of a box on the contents, excluding border, padding, and margin — that make pure CSS solutions effectively impossible.
- Another big issue, for now, is the size of alpha-transparent PNG images. If these were more reasonable, it would be easier to design in a res-independent manner. Bug as of now, any image that has color often ends up in the 25K+ range. Add a handful of these in, and you can make a page load very slowly. The only solution for this, sadly, is ensuring that everyone has access to true high-speed internet.
Sometimes I get the most frustrated because the W3C specs are always so overcomplicated. Look at border-radius, for example. I would guess that 99% of the use of this would be to simply specify a single radius. Usually the designer just wants to soften the corner of a box. However, the spec includes elliptical corners, which has to significantly complicate the design of it. It also doesn't specify (I believe) that the content inside should be clipped automatically, leading to useless designs where interior components stick out past the radius. (At least, that's what happens in FF, which isn't 100% compatible.) Of course, with border-image, we once again don't need border-radius as much.
Of course, with IE9 only just now supporting border-radius, and Opera not supporting it yet at all, we'll probably not see more advanced CSS+HTML-only interfaces for another 5-10 years. By then, who knows what we'll be working on!