Formen in CSS

Mit den „Cascading Style Sheets“ ist mit jeder Version mehr möglich. In neuerer Zeit werden so auch Formen und Logos in CSS nachgebildet. Einer der Vorteile dieser Technik ist die gesparte Bandbreite bei der Übertragung.

Die Hauptseite von "Shapes with CSS"

Die Hauptseite von „Shapes with CSS“

Auf der Seite „Shapes with CSS“ welche unter http://cssshapes.iweb.uz/ zu finden ist, kann man sich Formen mit den entsprechenden CSS Quelltexten anschauen. Auch das Vorschlagen neuer Formen ist dort möglich, welche ebenfalls auf der Seite erscheinen sollen.

Fujitsu Server und die CSS Led

Kaum nimmt man einen Server aus dem Serverschrank, zeigt der entsprechende Server einem welche interessanten Fehler er über die LEDs an der Front ausgeben kann. In diesem Fall leuchtete bei einem Fujitsu Server die CSS LED. CSS steht dabei laut Fujitsu für „Customer Self Service“.

Die leuchtende CSS LED

Der erste Schritt führt bei einem solchen Fehler (wenn ein Windows auf dem System läuft) in die „Computerverwaltung“ und dort in die „Ereignisanzeige“ in den Unterpunkt „Anwendung“. Dort sollte die Quelle „ServerView Agents“ einen Fehler geworfen haben:

A critical error happend while BIOS selftest in cabinet 0 of server EXAMPLE. See server management message log (recovery log) for detailed information.

Der Fehler an sich ist nicht sehr aussagekräftig, so das man hier den Fehlerspeicher des Servers auslesen muss. Dies geschieht über die „Fehlerspeicheranzeige“ welche Teil der „Fujitsu ServerView Suite“ ist. Dort sieht man dann auch das der Fehler in diesem Fall nicht wirklich dramatisch ist:

Ursachen:
• Keyboard error detected during Power-On Self-Test (POST)
Problemlösungen:
• Check in the case of headless mode (without local keyboard) that AVR license is enabled or keyboard check is disabled
• Check keyboard cable
• If problem persists replace keyboard / cable.

Die entsprechende Einstellung wird im BIOS geändert und schon läuft der Server wieder wie am Schnürchen.

Runde Ecken unter Safari Browsern deaktivieren

Die Texteingabeelemente sind unter Safari so z.B. auf dem iPad mit runden Ecken versehen. Wer dies nicht möchte, der sollte in die passende CSS Datei einfach folgendes eintragen.

input {
    -webkit-appearance: none;
    border-radius: 0;
}

Damit sind die runden Ecken dann verschwunden. Das zusätzliche „border-radius: 0;“ muss angegeben werden damit das ganze auch unter iOS 5 funktioniert.

Die Raute im CSS

Beim bearbeiten einer CSS Datei viel mir folgendes Stück Quellcode ins Auge:

a {
	padding: 5px;
	#margin-left: -12px;
}

Die Eigenschaft „#margin-left“ ist nicht standardkonform und sollte nicht interpretiert werden, was zur Frage führte was sie in der CSS Datei zu suchen hatte. Nach einiger Suche ergab sich die Lösung, es handelt sich dabei um eine Form der Browserweiche welche nur vom Internet Explorer ausgewertet wird.

Weitere Informationen gibt es unter:
http://de.selfhtml.org/css/layouts/browserweichen.htm

Dem pre Tag den Zeilenumbruch beibringen

Der pre Tag dient dazu einen Text wiederzugeben wie er eingegeben wurde. Das ist an sich auch ganz schön, kann aber bei kleinen Auflösungen oder einem responsiven Design zum Problem werden. Den dort wird entweder das Layout zerschossen oder der Inhalt des pre Tags durch eine overflow CSS Anweisung abgeschnitten. Abhilfe schafft hier:

pre
{
        white-space: pre-wrap;
}

im CSS. Dadurch wird der pre Tag im Zweifelsfall umgebrochen und bleibt somit lesbar.

Weitere Informationen gibt es unter:
http://www.css4you.de/Texteigenschaften/white-space.html
http://blog.bissinger.biz/zeilenumbruch-im-pre-tag/
http://de.selfhtml.org/html/text/praeformatiert.htm