You are not logged in.

  • Login

This articles has been requested to be deleted.

Monday, January 25th 2010, 4:35pm

Tags

best practice, CSS

Abstract

CSS Optionen die man setzen sollte, bevor man überhaupt mit der Arbeit am HTML Code beginnt.

Article

Egal um welchen Bereich es geht. Mit den Jahren sammelt man Erfahrung, man wird besser, man gewöhnt sich einen gewissen Stil an.
Irgendwann gelangt man an den Zeitpunkt und möchte anderen von seinen Erfahrungen berichten.

1. Bilder nicht umranden


Nutzt man Bilder als Links, dann werden diese umrandet.

Cascading Style Sheets

1
2
3
img {
	border:0px;
}

<<DEMO FOLGT>>

2. Links nicht umranden


Nutzt man JavaScript Links um zum Beispiel AJAX Requests zu senden, bleiben diese Links aktiv und erhalten eine Box bis sie ihren Focus verlieren indem auf andere Container geklickt wird.

Cascading Style Sheets

1
2
3
a:focus {
	outline:none;
}

<<DEMO FOLGT>>

3. Tote Bilder


Bindet man Bilder aus fremden Quellen ein, sollte man dafür ein ein Alternativbild per Hintergrundgrafik festlegen.

Cascading Style Sheets

1
2
3
4
5
img.specialclass {
	background-image:url(default.gif);
	width:100px;
	height:75px;
}

<<DEMO FOLGT>>

4. Zeilen- + Spaltenausrichtung


Ich finde eine vertikal-mittige Ausrichtung sehr komisch.

Cascading Style Sheets

1
2
3
tr {
	vertica-align:top;
}

<<DEMO FOLGT>>

Außerdem habe ich oft das Problem, dass der Firefox bei globalem center, den Text in Zellen standardmäßig dennoch links ausrichtet - der Internet Explorer hingegen, die mittige Ausrichtung überall übernimmt.

Cascading Style Sheets

1
2
3
td {
	text-align:left;
}

<<DEMO FOLGT>>

Lexikon 4.1.5, developed by www.viecode.com