CSS3

The Webkit project have announced support for a new range of CSS declarations, to be used for putting strokes around text. This strikes me as a little strange for two reasons:

I went through the logs of some of the sites I own or manage today, to see what kind of uptake there’s been for IE7. From ten sites, some business and some personal, the percentage of users varies between 1% and 12% using IE7.

The Internet Explorer team are asking (again) for input on most-wanted improvements for the next version of IE. Most of the work seems as if it will be focused on Javascript and the DOM, but as you can see on this wishlist there are also requests for CSS updates – including support for RGBA, HSL and HSLA from the CSS3 colour module.

Last week we unveiled the CSS selector test over at css3.info. The test consists of over several hundred separate test cases, each designed to test a certain aspect of the compatibility of your browser with the CSS selector standards. Today we are going to expand the number of test cases to 578.

The new tests have a large impact of the results. There are quite a few browsers that used to pass with the old test cases, but fail with the new test cases. Generally we added test cases for the following situations:

• Dynamic updates: If you update the DOM using Javascript this should also affect the CSS selectors. Take for example the :empty selector. It only matches elements without any children. If you dynamically add a new child it should not longer match that particular element.
• White space in attribute selectors: There are four different ways an attribute selector could be written: [attribute=value], [attribute =value], [attribute= value] and [attribute = value]. We now test if your browser supports all of these variants.
• Case sensitivity of the value in attribute selectors: The previous version of the test contained a test case for determining if the value of an attribute selector was compared in a case-insensitive way. However this was not complete. We only tested the align attribute – which should be treated in a case-insensitive way. Only Konqueror failed this test. But there are also a lot of other attributes which should be tested in a case-sensitive way. Now almost every browser fails this test. More information about this case-sensitivity can be found on rakaz.nl: CSS selector bugs: Case sensitivity

We also changed the way results are reported. Instead of just showing whether a selector failed or passed, we now detect if the selector is fully supported, buggy, or not supported at all. This should give all of us a better idea about the state of the compatibility of each browser.

KHTML, the Konqueror rendering engine, has received another upgrade – and with it, more implementation of the still-officially unannounced CSS3!

According to the release notes, KHTML 3.5.5 now has support for the HSV/HSVA color values. I must confess to being a little baffled by this; the CSS3 color module names HSL/HSLA values (of which HSL is supported), but not HSV/HSVA. Perhaps someone more au fait with colours could help me out on this one.

Also now supported, apparently, is the outline-offset property – which does exactly what it says; offsets the outline around a page element.

Please bear in mind I haven’t tested these, yet.

The latest version of the Konqueror browser, 3.5.4, supports more CSS3 declarations.

background-origin, background-clip and background-size are all supported with the proprietary -khtml- prefix. We’ll update our pages soon so you can test them for yourselves.

See the full list of changes for the latest release here.

I’ve said it before, but it’s really a shame that probably less than 0.1% of internet users choose Konqueror.

Update: I’ve just seen that Konqueror has also implemented the :checked selector, making it the first browser to support every CSS3 selector. In the last month, 0.48% of this site’s visitors used Konqueror – and I suspect quite a few times it was me, testing.

A couple of links with some relevancy to CSS3:

CSS Shortcomings: Why CSS2 isn’t perfect for layout, and what’s in the CSS3 spec to correct that.

IE7: Old Bugs for New: Microsoft’s next browser won’t be helping to push the web forward; it’s so full of bugs that even current pages may not display properly.

The Internet Explorer team have released a list of all the CSS changes which have been introduced into IE7. As we’ve already shown there is now the beginning of CSS3 support, with a few selectors included.

Other than that, despite the many changes IE7 is still below the level of almost any other rival browser and is not recommended except to those who have no alternative.

Vitamin have posted an interview with Chris Wilson, Group Program Manager of the Internet Explorer team at Microsoft.

He mostly talks up the new RSS features in IE7 (which should really push the standard into the big time), but the most interesting answer he gives is to the final question:

Is IE going to auto-update to IE7? I think that the first thing really is that we can’t really force it on users. That’s not our goal. We really do like to offer users choice. It is a different user interface, some people will be really jarred by that. I think that we certainly want to encourage everyone out there to, um, I do believe that we will offer it through Windows Update, but it won’t be an automatic silent update, certainly it won’t be like you come in one day and suddenly your computer’s running IE7 rather than IE6. Certainly we have to ask the user if they really want it. As nice as it would be to blast it onto everyone’s system I don’t think that can happen, so.

Which means that it will be offered as part of the Windows Update programme, but not downloaded automatically. Which means we’ll have to put up with IE6 for a long time yet, and full CSS3 implementation is a long way down the road.

Windows users who want to see what Safari is all about will be interested to know that a new browser (provisionally called Swift) is in development, which uses the WebKit browsing engine for the first time on Windows. You can download a preview of Swift here; be warned, it is a very early release and so may be buggy. I installed it on my dev PC and it seems to be stable, however.

The WebKit engine is lightning fast at rendering pages, but it does still have a number of quirks when implementing some CSS3 Selectors. If you’re not worried about using development software, download Swift and play with it a little.