The Future of Style

The Future of Style aggregates posts from various blogs that talk about the development of Cascading Style Sheets (CSS) [not development with Cascading Style Sheets]. While it is hosted by the W3C CSS Working Group, the content of the individual entries represent only the opinion of their respective authors and does not reflect the position of the CSS Working Group or the W3C.

CSS3 . Info Level 3 features in the wild

The beauty about working on a site that is specifically targeted for one the most popular mobile devices around (aka the iPhone) is that the vendor with the least CSS support (*cough* IE *cough*) doesn’t exist on it (purely because of its inadequate CSS support in this case).

Depending on the browser matrix you have to work with and the platforms you’re coding for, utilizing Level 3 (and some Level 2.1 in IE’s case) selectors simply isn’t realistic, although properties on the other hand can be used to progressively enhance an elements appearance in this particular context.

But what if a site was created to serve one specific handheld device in which Safari (along with its sufficient CSS3 support) was the default browser? Well, this is what Facebook has done with it’s iPhone-specifc UI. By peaking into their stylesheet you’ll notice that they’re implementing a number of Level 3 selectors, properties and property value additions. They include the:-

For comedy value, try viewing the site in IE.

Having this sort of free reign on selectors and properties is an interface developers dream in this day and age, and hopefully in a couple of years we’ll be able to structure a stylesheet with some similarly advanced features.

CSS Working Group Blog Resolutions 2008-07-02

CSS3 . Info Opera Dragonfly alpha 2 RC now available

This is just a quick note, to inform CSS3.info readers that the release candidate for Opera Dragonfly alpha 2 has just been released. Check out the Opera Dragonfly web site for download instructions, and the Opera Dragonfly Blog for more information on the release. There will be a short RC phase then alpha 2 will be uploaded to the main Opera Dragonfly URL that is built into Opera 9.5, and existing alpha 1 users will be upgraded automatically. The web site will also be updated to highlight the new features.

One feature of note for readers of this blog is the auto-complete feature for CSS properties and values in the Styles sidebar. Using the up and down arrows will cycle through the valid properties that Opera supports. This (in theory) will give a good indication of all the CSS3 properties that Opera 9.5 (and subsequent versions) has implemented. As CSS editing is live and immediate, it is a great way to test new features and play with the values.

Please give feedback on Opera Dragonfly alpha 2 using the usual channels.

CSS Working Group Blog Resolutions 2008-06-25

Resolved

Full minutes

CSS3 . Info Latest Webkit nightlies now support CSS Variables

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.

CSS Working Group Blog Resolutions 2008-06-11

Full minutes.

CSS3 . Info Firefox developers accelerate CSS implementation

Firefox 3 isn’t quite out yet, but already there are some exciting plans for CSS implementation in future versions.

FF3.1 should see all the selectors (test them here), @media queries, text-shadow, font-stretch, and downloadable web fonts with @font-face; FF4 should add calc() and attr() values, along with the Animation and Transitions modules proposed by the Webkit team.

You can see a list of other planned implementations on the Mozilla Wiki.

CSS3 . Info Opera 9.5 launches with lots of CSS improvements

Opera have released version 9.5 of their browser today, and the good news for our readers (and web users in general) is that there are lots of CSS 3 features implemented. This article on dev.opera.com goes into more detail, but major improvements include:

Download a copy today and take a look at some of the examples on our Preview pages. I’ve just noticed that the background-size example doesn’t work, but that seems to be our implementation at fault, not theirs.

CSS Working Group Blog Resolutions 2008-06-04

Resolved

Other notes

Full minutes. Discuss on www-style.

CSS3 . Info Firefox 3.1 is the latest to pass our selectors test

I’ve just put a pre-Alpha build of Firefox 3.1 through its paces, and can confirm (following David Baron’s announcement) that it gets a score of 578/578 in our CSS3 Selectors Test, which means not only support for the new selectors, but some bugs fixed in existing ones. To put that score in perspective, Firefox 3 scores only 357/578.

There is an almost perfect score on Daniel Glazman’s Selectors Test too, with only one discrepancy showing up.

So Safari, Opera and now Firefox all pass the test; of the major browsers, that only leaves one Inevitable Exception…

Those brave enough to try pre-Alpha can download builds from Mozilla’s FTP server. The usual warnings and disclaimers apply!

CSS3 . Info Slow times for CSS 3 news

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.

CSS Working Group Blog Notes and Resolutions 2008-05-28

Full minutes

CSS Working Group Blog Charter Discussions 2008-05-21

Almost the entire 2008-05-21 meeting was a discussion of the module list that is not yet drafted for the charter. Several conflicting arguments were brought up. Here's an unordered summary of points in the discussion.

The main conflict here seems to be whether

The conclusion of the discussions was that the chairs should draft the module list section of the charter. Currently only the unedited summary of implementor feedback has been written.

Opera was not represented in these discussions. They also have not sent in any comments previously.

Full Minutes

CSS Working Group Blog Resolutions 2008-05-14, 2008-05-21

CSS Working Group Blog CSS Snapshot 2007 and CSS Namespaces

The W3C published a Last Call Working Draft of the CSS Snapshot 2007. If you are following the development of CSS and you haven't read it yet, I recommend doing so. Its goal is to put the various specs in context and create a coherent picture of the current state of CSS. The deadline for comments is June 9th.

The W3C has also published a Candidate Recommendation of the CSS Namespaces module. This module has been implemented for years based on a 1999 draft spec, so the module is just starting to catch up with the times. The two major changes that implementors should be aware of are: prefixes are explicitly case-sensitive, in line with our resolution of CSS2.1's case-sensitivity issue; and handling of empty-string namespaces has been clarified.

CSS3 . Info A couple of quick updates

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.

CSS Working Group Blog Resolutions 2008-05-07

Resolved

Other topics

Full minutes Discuss on www-style

CSS3 . Info Shaun Inman proposes CSS Qualified Selectors

Shaun Inman did a very interesting post yesterday on what he describes as “CSS Qualified Selectors”. The idea is nice, he wants to be able to do:

a {
    text-decoration: none;
    color: #A10;
    border-bottom: 1px dashed #A10;
}

And then for images:

a < img { border: none; }

So if <img> has a parent <a>, the border isn’t there.

What’s most interesting about the post though is the comments. It seems, as Eric Meyer states there, that this kind of selector has been discussed quite a few times on the CSS mailing list, and isn’t doable. Dave Hyatt, one of the core WebKit developers, comments with a good explanation of why it can’t be done. It’s a nice read, and a good insight into the difficulties of developing a new standard.

CSS3 . Info A further opportunity to help evolve CSS 3

Jason Cranford Teague has volunteered to edit the CSS Basic UI, CSS Hyperlink Presentation, CSS Fonts and CSS Web Fonts modules and is looking for feedback from users on the latter two. He asks:

Tell me what you think are some of the font styles and features missing from the current specification. What do you expect to be able to do with typography on your Web pages that you can not do now? What are you doing now with kludges that you would like to see simpler ways of doing?

Leave a comment on his blog if you have any ideas; and why not leave a comment here, too, to let us know what your opinions are? No deadline has been given, but I suppose it’s the sooner, the better.

webbedENVIRONMENTS Web Typography: Tell Me What You Want

I'm going to be setting the new standards for typography on the Web, and I want your help.

CSS3 . Info Debug CSS3 (and more) with a dragonfly

Opera has one of the better levels of support for CSS3 (and other standards), making it an ideal platform for experimenting with future technologies and new techniques that these standards will offer. However, this has always been let down by the fact that Opera is very lacking in the web developer tools segment. To be frank, Firebug and the Web Developer Toolbar blow away anything Opera has offered in this realm.

This short coming is about to change soon. Opera has just announced today, with the release of Opera 95 beta 2, that Opera Dragonfly will be Opera’s web developer tools. These will be released as an alpha on the 6th of May. In line with their alpha status, the tools will not be feature complete, but they will show a good foundation of Opera’s developer tool vision.

Once released, Opera is looking for feedback on the tools, to make sure they fit the needs of real world web developers and designers. I’m looking forward to web developers getting their hands on the Opera Dragonfly and finding out what the impressions are. If you are interested then go the the Opera Dragonfly website on the 6th or just open the Web Developer menu item from the tools menu. In the mean time, Opera 9.5 beta 2 (Kestrel) has been released today, so it is a good time to check out what CSS3 properties it supports.

CSS Working Group Blog Resolutions 2008-04-23

Resolved

Other notes

minutes, discuss

CSS Working Group Blog Resolutions 2008-04-16

Resolved

Other notes

Minutes, discuss

The CSS3 Soapbox! Limitations of CSS

Rockholderdesign gives a brief introduction to CSS and writes about some of its limitations.

CSS3 . Info Webkit provides implementation of CSS-based gradients

I don’t have time at the moment to write a good summary, but the link to the announcement is below which includes some examples

CSS Gradients in Webkit

CSS Working Group Blog Notes and Resolutions 2008-04-09

Full minutes

CSS3 . Info New features proposed for CSS

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

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.

CSS3 . Info CSS Working Group latest resolutions

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:

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

CSS Working Group Blog Resolutions 2008-03 San Diego Part VI: CSSOM

CSSOM View

CSSOM

CSS Working Group Blog Resolutions 2008-03 San Diego Part V: Future Features

Highly experimental brainstorming-level stuff. No resolutions, just notes.

Tree List Styles

Discussed tree lists styling prompted by Andrew Fedoniouk.

Multi-Style Elements (aka Collapsible Elements)

Idea was to have two pseudo-classes, one :normal and one :alternate. UA toggles between styles. (N styles also possible.)

Existence of the pseudos makes the element toggleable. There were strong reservations about that.

Bert's writeup is still Member's only.

Scriptable Selectors

Idea was that a selector accepts a JavaScript function that returns true or false, determining whether the selector matches or not. VERY strong reservations about this from implementors: executing functions during selector matching is scary, particularly if those functions are allowed to modify the elements during matching!

Alternate idea is to define a set of tokens on the element node, allow scripts to add and remove tokens, and match against that set.. thereby avoiding the execution of any functions during style matching.

Constants

Clear use case for importing colors from a site-wide style sheet. CSSWG wants more concrete use cases for anything beyond that.

fantasai points to webstandards.org comments and suggests macros for selectors, values, and declaration sets would fulfill most requests there.

CSSWG will post a simple proposal macros for values only, and see if that will cause web designers to post real examples of where more powerful macros are needed.

Changing the Subject of the Selector (Parent Selector)

Suggested to add this to Selectors 4. Need implementors' "strong interest".

text-orientation

Steve reports on conclusions from joint meeting with Paul and fantasai: plan is to introduce text-orientation, which operates on runs of tex--unlike XSLFO/SVG's glyph-orientation, which operates on individual glyphs. Glyph-orientation's behavior causes characters to be in the wrong order for some of its values. text-orientation will take keywords for common effects in vertical text.

The Future of Style features:

If you have a post you want to add to this feed, post a link (or the whole thing) on the CSS3 Soapbox. If you own a blog with frequent posts about the future of CSS, and want to be added to this aggregator, please get in touch with fantasai.

Recent entries:

CSS Valid CSS!Valid HTML 4.0! RSS feed Atom feed

fantasai