CSS3

For those of you that haven’t seen, Dev Opera has just published a two part article series on styling form controls, by Christopher Schmitt. The first part covers using attribute selectors (which work in IE7, Opera, Safari and Firefox) to slim down your markup by providing a way to identify certain form controls without the addition of a class value. An example of this is using input[type="text"] in the CSS, rather than adding class="text" to the HTML file. The second part takes this further, by taking advantage of the :enabled, :disabled and :checked pseudo-classes, and a dash of opacity. The browser support for these pseudo-classes are not as strong however. According to Christopher, Opera is the only browser that supports all three correctly.

If you are not aware of Dev Opera (known lovingly as Devo internally at Opera), it is Opera’s new developer site. Look out for a fantastic article on CSS3 from CSS3.info’s very own Peter Gasston in the near future.

This is a sponsored post for my employer, Onetomarket, I don’t usually do sponsored posts here, but since this could ease my work life a bit :) , I’ll make an exception.

We’re looking for a full time developer here at Onetomarket to help us in automating a lot of our work.

If you:

• Are a good PHP / MySQL developer.
• Can develop an application based on different API’s on your own.
• Have ideas on how to improve stuff and can explain them to us.
• Would like to work with a team of young and enthusiastic internet professionals.

Then maybe you should join us in our office in Arnhem, the Netherlands or in Barcelona, Spain. Mail me at joost ” at ” joostdevalk dot nl, and I’ll set you up for a meeting!

To create a coherent collection of blog discussion about CSS3 and the future of CSS, the CSSWG and the css3.info team have teamed up to create a W3C-hosted aggregate feed, The Future of Style, and an associated css3.info-hosted open community blog, the CSS3 Soapbox.

We’re starting off The Future of Style by pulling in the CSS Working Group Blog, css3.info, and the CSS3 Soapbox. 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 The Future of Style, contact fantasai.

The CSS3 Soapbox is meant to give you as a developer, designer or whatever, a voice in css development. This feed will be read by all those involved in CSS development, so you can get your message across easily.

We want you to join the conversation!

Next up in our now probably well known series of interviews is the lovely Jina Bolton, it’s good stuff, so keep reading!

With the latest weekly of Opera, Opera will support the HSL colour unit. With HSL added, there are only three units missing, HSLA, RGBA and flavor. I don’t really understand flavor, or why it would be useful and no browser currently supports it. I’d suspect now that Opera Kestrel supports RGB and HSL, that the two colour models with added alpha channel support will both be added at the same time. I can’t confirm when these will be added yet however. You can test out support for this here.

I’m working on a support chart for the colour module, that just needs testing to be finalised in IE, as I currently don’t have access to IE7. This should be added to the Module Status page shortly.

1. Hi John, thanks for agreeing to this interview! Could you introduce yourself a bit to our readers?

   Sure! I’ve been a software developer, running my own company Westciv, with my business partner Maxine Sherrin since 1993. We’ve been selling software online since 1995, which of course lead us to web design and development (my interest in hypertext goes back to the 1980s, and our first application was in fact a hypertext knowledge management system.

Slides from Jina Bolton’s presentation at FoWD 2007, CSS3 And What Could Be [PDF, 3.2MB], are now available to download from her website Creating Sexy Stylesheets.

There won’t be a lot of revelatory information in there for regular readers of this site, or those otherwise clued up on CSS3, but there are some nice practical examples to take a look at, particularly of the Advanced Layout and Grid Positioning modules.

Rijk van Geijtenbeek wrote in to tell us that he’s created a CSS3 Quick reference in the form of a browser sidebar (direcly usable in Firefox and Opera) for quick access to all CSS 3 properties from all published modules. This, he says, is an ofshoot of Eric Meyer’s CSS 2 QR sidebar which he’s been maintaining for a few years.

His official announcement can be found here, and you can download this or his other panels from here.

It looks great, so thx a lot Rijk for putting your work into this!

The Webkit team have certainly been busy recently; since we mentioned the introduction of web fonts, they’ve also implemented transformations and animations.

Transformations, via the -webkit-transform property, allow you to scale, rotate and skew block elements; reader Ain Tohvri has put together an impressive test suite. At the moment this property doesn’t affect layout, so behaves more like a relatively positioned element.

Animation, which uses the -webkit-transition family of properties, allows you to set timings for fades, rotation, expansion, collapses, and more. They work in the same way as many current JavaScript libraries.

I’m in two minds about this; while it’s always welcome to see more innovation from browser manufacturers, I can’t help but think that they’re focussing their energies in the wrong direction. As I mentioned above, all of the above effects can be replicated with JavaScript libraries, and I don’t think that CSS should be used for controlling behaviour so explicitly. Users who don’t like to see animated pages currently have the option of disabling scripts, but they won’t have the option of disabling CSS in the same way.

Also, IMHO, there are a more pressing areas of CSS that need investigating; the Advanced Layout or Grid Layout modules are more important to the future of CSS than animations and transformations.

On the positive side, the Webkit team have promised to release technical documents which explain the proposed spec in detail.

If these new features float your boat, you can test them out by downloading the latest Webkit nightlies.

Too many people see the Web a bit like television: who ever heard of incompatible content? If there is an error, it’s because the TV set is broken, or maybe the antenna. On the Web, it is much more likely that the content is invalid, but try to explain that to users who just want to buy their holiday or see their bank account…

A very interesting interview with Bert Bos, on the history and future of CSS.