Note: When in standards compliant mode, Internet Explorer does not support comma separators in clip:rect() statements. According to the defintion, there have to be commas. If IE is in quirks mode, using commas is just fine. This is really weird.

Wie in jedem Jahr, so gibt es auch in diesem Jahr einen Adventskalender von den Webkrauts zum Thema Webstandards.

Der Unterschied zum letzten Jahr: diesmal ist auch ein Artikel von mir dabei. Über den Inhalt verrate ich aber natürlich nix :-x

Since I switched to Safari as my main browser, I notice these cute search input boxes from time to time. They don’t look like regular textfields but have rounded corners and take (among others) these additional parameters:

• placeholder="Text": Like the attribute says, a placeholder text can be defined. That means that a grey text appears when the field doesn’t have the focus and is otherwise empty.
• autosave="id": Saves a history of the search terms the user entered. The list is shared among all inputs with the same autosave id. It is advised to use a certain format for the id.
• incremental="uri": This allows Spotlight-like find-as-you-type behavior. Unfortunately, this is completely undocumented. It is not known what format the return value should have.

I always liked this input box and intended to use it with my new theme. However, the value search is non-standard which made me keep away from it. Instead, I wrote a Drupal module that adds a JavaScript file which in turn changes the type value of Drupal’s search boxes to search.

Ja genau. Und zwar u.a. vom Hasso-Plattner-Institut. Komplett online. Hier.

Inhalte sind unter anderem: TCP/IP, XML, Kodierung, LAN, IPv6, SSL, URIs, HTTP, HTML, CSS, Web 2.0, AJAX, Web Services, Semantic Web u.v.m.

Warum kann man Cascading Stylesheets eigentlich nicht verschachteln? Und zwar so:

ul#navigation {
  background-color:#000;

  a {
    color:#FFF;

    strong, em {
      font-weight:normal;
      padding:0.25em 0.5em;
      border:2px solid #FFF;

      :first-letter {
        font-size:1.5em;
        text-transform:uppercase;
      }
    }

    em {
      background-color:#555;
    }
  }
}

In “normalem” CSS würde das dem Folgenden entsprechen:

ul#navigation {
  background-color:#000;
}

ul#navigation a {
  color:#FFF;
}

ul#navigation a strong, ul#navigation a em {
  font-weight:normal;
  padding:0.25em 0.5em;
  border:2px solid #FFF;
}

ul#navigation a strong:first-letter, ul#navigation a em:first-letter {
  font-size:1.5em;
  text-transform:uppercase;
}

ul#navigation a em {
  background-color:#555;
}

Der Platzbedarf wird zwar damit nicht geringer, aber ich finde es deutlich leichter zu lesen und man kommt sich mit irgendwelchen Anweisungen nicht so leicht in die Quere.