• 201118 Mar

    Opera have once again kicked their level of CSS3 support up a notch with the release of the latest beta version of their popular web browser. Opera version 11.10 beta, code named ‘Barracuda’, was first unveiled at this weeks SXSW in Austin, Texas, before being made available for download as a public beta yesterday.

    The most notable improvements to the browser, in terms of CSS3, are support for CSS3 multi-column layout and partial support for CSS3 gradients.

    CSS3 Multi-column Layout

    The CSS3 Multi-column Layout module, released as a candidate recommendation in December 2009, introduces new functionality to CSS that allows developers to specify that the content of an element be laid out in multiple columns.

    Opera 11.10 beta introduces full support for the CSS3 Multi-column Layout module, without the need for vendor prefix. More information can be found on the Opera website here.

    Mozilla (Firefox) and Webkit (Safari / Chrome) have already supported multi-column layout module for some time.

    CSS3 Gradients

    CSS3 gradients were first introduced by Webkit back in 2008 and have been implemented by Webkit and Mozilla for some time, however their first inclusion in a CSS3 specification occurred only recently with last month’s updated working draft of the Image Values and Replaced Content module.

    With this latest browser version Opera introduces partial support for CSS3 gradients. At this time only linear gradients are supported (the specification also proposes radial gradients, already supported by Mozilla / Webkit) and gradients are only supported for the background and background-image properties. You’ll also need to use the -o- prefix for the time being.

    Full details can be found on the Opera website here.

    Additional CSS Improvements

    According to the Opera website, this release also includes several other improvements to CSS support, including:

    • Added the CSS Viewport meta property target-densityDpi.
    • Added the CSS -o- prefixed media feature -o-device-pixel-ratio.
    • Added the devicePixelRatio property on the Window object.
    • Added two new CSS cursor property values; -o-zoom-in and -o-zoom-out.

    The latest beta can be downloaded here, full information on the improvements in this release can be found on the Opera website here.

    You can skip to the end and leave a response.


  • Comments

    • 01.

      Gradients are welcome, but still no Flexbox support…

    • 02.

      Although I’m looking forward to Flexbox, I’m simply glad that most of the major browsers have coordinated (for the most part) when it comes to the most commonly-used elements in design, including CSS. I’m ready to simply ignore IE5-7 CSS hacks altogether and concentrate on having a main media style sheet along with an appropriate mobile profile.

      But still, I can’t wait to see Flexbox support arrive in all the major browsers. It’s always a lotta fun to get a new browser version, look at all the new features, and then look for bugs or other oversights, then complain about it on the interwebz. Because, shamelessly- yet honestly-speaking, I can’t maintain myself w/o having something to complain about. xD

      Informative post as usual, CSS3.info!

    • 03.

      Have you noticed the new FireFox Update of Version 4? It has more CSS3 support.

    • 04.

      Yes, this was covered when firefox 4 was released as a beta version last year.

    • 05.

      Hi there

      That was a huge missing for Opera in the past, the CSS3 gradients. When you compare each browser you will see that each one of them offers something unique. At the time of writing, Safari is the only one to support CSS3 3D transforms. Opera is the one with the HTML5 color picker. And Firefox 4 does support HTML5 browser side validation most completely.

      CSS3 flexbox is great and there is no need to wait: https://github.com/doctyper/flexie

    • 06.

      Opera just drop prefix for -o-zoom-in and -o-zoom-out in latest snapshot

Hosting by: