Nein. Nicht zum Essen, sondern ein Bündel Werkzeug und Inspiration, das ich heute zu Tische tragen möchte. Interessante Dinge, die ich gefunden habe und teilen möchte. Das Buffet ist eröffnet.

Zum Basteln

ecsstender verspricht moderne CSS Eigenschaften für jeden Browser zugänglich zu machen

20 Typografie Plugins für Wordpress

jQuery Einstieg: Selektoren, Filter und Traversing

Eine Liste mit Tools rund um Typografie im Webdesign

Von Photoshop zu HTML: Das ultimative Guide

Mozilla und das Web Open Font Format WOFF

Eigene Formularfelder im Wordpress Backend

Mootools Floom: Der etwas andere Bilder Slide Effekt

Tools

Google Chrome: Jetzt auch für Mac erhältlich. Developer Release

Tags: CSS, css3, design, fonts, Google, Mozilla, Typografie, Webdesign | In der Kategorie Webdesign

Oder ganz einfach: Mach dir die Ecken deiner Boxen so rund wie ein Toastbrot. Dass das wohl nicht immer so einfach ist, wie es sich anhört, wird der ein oder andere schon gemerkt haben. Ich war eigentlich wieder einmal zufällig auf dieses Thema gestossen und habe die besten Lösung einmal rausgesucht.

Nun gut, die gute alte Methode, das Ganze mit Bildern zu realisieren bleibt wohl immer die Beste, aber wohl nicht die Konfortabelste. Immerhin kann jeder gängige Browser Bilder anzeigen. Mit den CSS Methoden ist das schon etwas anders. Hier hat praktisch jeder Browser seinen eigenen Willen, auf jeden Fall bis sich CSS3 mal durchsetzt und jeder Browser mit dem gleich Befehl ansprechbar ist. Wie auch immer, auch für das gibt es Lösungen.

Die Mitspieler

Die Anzahl der Browser, die abgerundete Ecken per CSS unterstützen ist relativ klein: Opera ab 9.5, Firefox ab 3.1a, Konqueror und Safari, der schon früh gelernt hat mit weichen Kanten umzugehen.

Nun muss man aber für praktisch jeden dieser Browser ein Attribut setzen. Das sieht dann in etwa so aus:

.meineKlasse {
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
-moz-border-radius: 10px;
}
Der Webkit Befehl ist zur Interpretation der abgerundeten Ecken für Safari und Opera. Moz, errät man schon fast, ist alleine für Mozilla und KHTML für Konqueror. Dabei wird die KHTML Methode wohl am meisten kompatibel zu CSS3 sein, laut aussagen.

In CSS3 gäbe es übrigens noch eine weitere Methode, mit Bildern zu arbeiten. Mit einem Befehl ist es nun möglich, mehrere Bilder innerhalb einer DIV zu positionieren. So könnte man sich schnell 4 Ecken rendern und als Bild auf die vier Ecken des DIVS zuweisen.

Tags: CSS, css3, tipps, tricks | In der Kategorie Webdesign