CSS shorthands!

Have you ever tried to debug something like border: 1px solid rgb(255, 0, 0); in Opera Dragonfly's CSS inspector, only to be greeted by a bunch of expanded properties?

Opera Dragonfly CSS inspector showing expanded properties

No more! Opera Dragonfly now has support for CSS shorthands, so the previous declaration will now be presented like this:

Opera Dragonfly CSS inspector showing the same properties in shorthand

Values that have been partially overridden will also be shown in this compact shorthand view:

The shorthand properties, with overridden partial values struck through

The implementation is not fully done yet. For example, the color swatch isn't added to a color if it's part of a shorthand value. Also, default values for things like the background property will always be visible. Both of these issues will be fixed.

And if you're a fan of expanded properties, you can still right-click in the CSS inspector and enable "Expand shorthands".

We would appreciate a lot of testing on this experimental release, as a lot of code has been refactored. So edit away, disable declarations and so on, and report back if something breaks.

We've also added per-language builds available as ZIP files for offline use.