fboës - Der Blog von Frank Boës

Für moderne Browser gibt es eine wunderbare Möglichkeit, verlässlich alle Inhalte einer HTML-Seite mit CSS skalierbar zu machen: Die Einheit “rem” (wobei “rem” für “root-em” steht).

Spätestens nach dem augenöffnenden Artikel über “fluid grids” ist man somit in der Lage, das Zusammenspiel von Typographie und Bildern besser zu gestalten.

In Kombination mit LESS (ihr wisst schon, diese wunderschöne Erweiterung von CSS) kann man sich mit einem kleinen LESS-Mixin das Umrechen von Pixeln in Root-EMs (rem) erleichtern.

CSS3 macht die Umsetzung von grafisch anspruchsvollen Seiten bedeutend einfacher, unkomplizierter und fehlerfreier. Dummerweise werden nicht alle Effekte von allen Browser unterstützt:

• Runde Ecken können alle Browser, außer der Microsoft Internet Explorer 8 und kleiner.
• Schatten an Boxen können alle Browser, außer der Microsoft Internet Explorer 8 und kleiner.
• Text-Schatten können alle Browser, außer der Microsoft Internet Explorer.
• Farbverläufe können alle Browser, außer der Microsoft Internet Explorer.

Diese Aufstellung habe ich hier mal ohne böse Absicht zusammengetragen. Ich kann nichts dafür, dass bestimmte Browser da schlecht aussehen.

Ich hatte mich ja schon gestern positiv über das CSS-Framework LESS ausgelassen. Und heute habe ich mein erstes Mixin dafür gebaut.

Das Mixin ist für den Bau von Prototypen gedacht. Generell geht es darum, schnell Dummy-Bilder in beliebieger Größe erzeugen zu können.

In den letzten Tagen habe ich mich ein bisschen mit LESS vertraut gemacht. Wie auch andere Projekte zielt LESS darauf ab, das Schreiben von CSS einfacher & übersichtlicher zu machen. Im Endeffekt kann man sich LESS vorstellen wie ein Framework für CSS.

Hier sind ein paar Dinge, die ich dabei gelernt habe: