CSS Tipps & Tricks

Eine Linie mit 1px Breite darstellen Eine Linie mit 1px Breite - Tipps aus dem Bereich CSS

Eine Linie mit 1px Breite darstellen

Eine einfache dünne Linie oder einen nur 1 Pixel breiten oder hohen Strich im Browser dazustellen, ist oft nicht ganz so einfach.

Legen Sie zunächst einen div Container an, definieren Sie dort die Schriftgröße auf 0 Pixel, die Länge sollte auf 100 % gesetzt werden und die Höhe auf 1 Pixel.

Beispiel:

 

Als Code sieht das so aus:

<div style="font-size: 0pt; height: 1px; width: 100%; background-color: rgb(255, 0, 0);"> </div> 

Schaut man sich nun im Internet Explorer das Resultat an, so wird man feststellen, dass der Strich 2 Pixel hoch ist.

Man benötigt daher noch die zusätzliche Angabe “line-height: 0px”. Wurden diese Einstellungen vorgenommen, so funktioniert es dann auch beim Internet Explorer. Natürlich können Sie diesen Strich auch noch positionieren.