CSS3

An interesting implementation has recently made its way into the latest Webkit nightlies – a detailed method of styling scrollbars using a combination of new pseudo-elements and pseudo-classes.

Example

Although the new syntax can seem complicated at first, Webkits implementation gives authors the ability to completely alter the look and feel of scrollbars of overflow sections, listboxes, dropdown menus & textareas, and when used in conjunction with border-image and multiple backgrounds, the results can look beautiful.

Whitepaper gives more details on the implementation.

For those of you not on the www-style mailing list, you may not be aware that Dean Jackson announced today that Apple have published updated proposals for Transitions, Animations and Transforms. This news comes after the recent decision by the CSSWG at their October F2F meeting that it is very likely that the CSSWG will accept to work on them [Apple’s proposals].

Full details of what’s been changed in these updated proposals can be found in Deans email, however, the most significant changes are splitting 2D and 3D transforms into separate documents and adding a list of properties that can be animated (and how to interpolate different property types)

It’s worth noting that these documents are only proposals, are likely to change, and haven’t formally been accepted by the W3C.

Dave Hyatt informs us that the latest Webkit nightlies now support an experimental implementation of CSS Variables.

The news comes only days after Daniel announced on his blog that he and Dave were in the process of finalizing a new version of the spec based on both feedback from readers and the Webkit implementation.

Nightlies can be downloaded from here and they’ve also provided a fair few test cases.

NOTE: Since mid-September, the Webkit implementation was discontinued for the time being.

News about developments in CSS 3 is hard to come by at the moment, so please forgive the slow rate of updates on the site in the last month. I attended the @media conference here in London last week and news on progress in CSS was noticeable by its absence, when even HTML 5 had its own session.

I see that Bert Bos has delivered a couple of presentations on the Template (formerly ‘Advanced’) Layout Module, but I can’t find slides of them anywhere. If anyone attended the talks and can send us copies, do please get in touch.

Other than that, the only news is that the CSS WG have released their list of expected module deliverables; the modules listed in the 2007 snapshot along with Media Queries look set to be Recommendations shortly, with many others to take on Candidate Recommendation status.

And that’s it. Sorry there isn’t more, or that it isn’t more exciting. I’m aiming to put together a load of new examples soon, so that should be more interesting!

Update: As mentioned in a comment below, no sooner do I say there’s not much going on than David Baron announces that the remaining CSS3 selectors have been implemented in a build of Mozilla (which will probably be seen in Firefox 3.1), and Media Queries are set to follow. That’s good news.

Over at Design Shack they’re four posts into the five-post Introduction to CSS3, which covers Borders, Text Effects, the User Interface and (coming soon) Multiple Columns. A nice intro to the subject if our own examples are too complicated for you :p

The new owners of the Fonts and Web Fonts modules, Jason Cranford Teague and John Daggett, say that only about 20% of the Web Fonts module is required for CSS (it is currently part of the SVG charter), and propose simplifying it before merging with the Fonts module. They hope to have a working draft of the new spec in August.

This week has seen the release of a raft of new proposals for features to be integrated into the CSS specification:

• CSS Animation
• CSS Transforms
• CSS Transitions
• CSS Variables

I personally have reservations about the Visual Effects proposals, feeling this is better suited to Javascript, but I seem to be in the minority on this so I will cede to the majority. I’m pretty excited about Variables, however.

The CSS WG had a face-to-face meeting in San Diego last month, and have released their latest resolutions in a series of posts on their blog:

Part I, Part II, Part III, Part IV, Part V, Part VI

Some of the highlights I saw on my first read through:

• Apple’s proposed animation & transition properties are to be considered.
• Web fonts are to be worked on with the SVG team
• The Advanced Layout module is still being discussed but will be renamed the Template Layout module
• A new type of list, tree-lines, was proposed
• A proposal for the use of constants will be published

Obviously there’s a lot more in there, but it’s nice to see that the Working Group is working!