CSS3: what’s now, what’s new, and what’s not?

Let the W3C be with you. Woo! Cross-browser compatibility problems should end.

Presenters
Molly Holzschlag – Opera Software
David Baron – Mozilla
Hakon Wium Lie – Opera Software
Sylvain Galineau – Microsoft
Date
Sunday, March 15
Sites
david baron
molly holzschalg
Jonathan Snook


CSS3 doesn’t really exist: the standard is being modularized so parts of “CSS3” can be implemented in browsers before others. But where is Apple?

Modules: Now

selectors
:nth-child(odd), :nth-child(even)
color
opacity vs. rgba()
borders
border-image, -moz-border-image
rendering properties
-moz-column-count, -moz-column-rule
text-shadow
-moz-box-shadow
-moz-border-radius
word-wrap: break-word
font-size-adjust (specify the font size by the x-height of the characters. e.g., 20px * 0.45)
@font-face (downloadable font specification where you define rules for each font and style): src: url(“font.ttf”)
media queries
@media screen, projection {}
@media print {}
@media (min-width: 22em) { }
@media all and (property) { }
Transformation/Paths
-moz-transform, -webkit-transform
svg clip-path, svg mask, svg filter

Modules: Future

  • width: calc(50% – 8px)
  • h1 { content: url(decorative.png); }
  • new layout systems for user interface?

Internet Explorer + CSS

IE must implement 2.1 completely, correctly, and optimally. IE8/02.27 does.

CSS3 in IE8

The future includes opacity of color, backgrounds, borders, selectors, web fonts, media queries, and multi-column.

Communicate: www-style (at) w3.org

Opera + CSS

CSS3 is ready for demo with backgrounds, borders, fonts, transitions, selectors, media queries, and generated content for paged media. Microsoft needs to adopt TrueType and OpenType.

Printing (Paged Media)

Use HTML and CSS to build PDF documents for printing. Some features: Leaders and auto page-number based on pagination, footnotes, page headers, and page numbers. Yes Software.

These are notes from a session at sxsw interactive. My own take on topics are mixed in with what the presenters were actually saying, so do not assume all of this content is my own.

Feedback

When you deal with open standards, you want a single standard to be implemented correctly in a number of different engines/ways because each implementation is taking a different perspective (mobile devices vs. rich devices). Otherwise you have stagnation. Competition on a standards level is a core problem.

Using floats for layouts doesn’t hit the mark. A true layout module is needed. Jonathan Snook. We need layout modules based on other system user interface design history. HTML5 separation of elements may clash with semantic coding.