HR-Tag mit 1 Pixel Höhe?

[Tetrapak]

Hi

Zuerst mal meine CSS-Formatierung:

hr {
    height: 1px;
    border-style: dotted;
    color: #000000;
}

Frage:
Im IE5 wird das HR-Tag mit dieser Formatierung korrekt mit 1 Pixel Höhe angezeigt, jedoch ist der Strich durchgezogen und nicht gepunktet. Mit Mozilla ist es umgekehrt, die Linie ist gepunktet, allerdings ist die Höhe 3 Pixel? Wie müsste die Formatierung korrekt lauten, um in Mozilla die Linie gepunktet mit 1 Pixel Höhe hinzubekommen, falls dies überhaupt möglich ist?

Danke
Tetrapak

[Thomas J.S.]

Hallo,

Frage:
Wie müsste die Formatierung korrekt lauten, um in Mozilla die Linie gepunktet mit 1 Pixel Höhe hinzubekommen, falls dies überhaupt möglich ist?

hr {
height:1px;
border:dotted 0.3pt #000000;
}

Grüße
Thomas

[Axel Richter]

Hallo Thomas,

Frage:
Wie müsste die Formatierung korrekt lauten, um in Mozilla die Linie gepunktet mit 1 Pixel Höhe hinzubekommen, falls dies überhaupt möglich ist?

hr {
height:1px;
border:dotted 0.3pt #000000;
}

Hä? Kannst Du das auch erklären? ;-))

Also, ich würde das so machen:

<hr style="height:1px; border-top:1px dotted #000000; border-left:0; border-right:0; border-bottom:0;">

,weil so nur die obere Rahmenlinie angezeigt wird. Die größere Höhe kommt, meiner Meinung nach, durch die sonst vorhandene untere Rahmenlinie zustande.

viele Grüße ;-)

Axel

[Thomas J.S.]

Hallo Axel,

Also, ich würde das so machen:

Ich habe nie gesagt, dass meine Lösung die einzige Lösung sei ;-)

Grüße
Thomas

[Axel Richter]

Hallo Thomas,

Ich habe nie gesagt, dass meine Lösung die einzige Lösung sei ;-)

Das habe ich nicht gemeint. Mich würde _wirklich_ interessieren, _warum_ Deine Lösung funktioniert. Ich hab da jetzt mal rumprobiert, und _Deine_ Lösung sieht wirklich ähnlicher aus im IE und NS7.0. Der NS7.0 macht bei meiner Lösung kleinere dots als der IE. Aber wie in aller Welt ist das zu Erklären?

<hr style="height:1px; border-top:.2pt dotted #000000; border-left:0; border-right:0; border-bottom:0;">
ergibt im NS7.0, Doctype HTML4.01 strict, keine Linie

<hr style="height:1px; border-top:.3pt dotted #000000; border-left:0; border-right:0; border-bottom:0;">
ergibt im NS7.0, Doctype HTML4.01 strict, eine Linie aus breiten dots, wie im IE

<hr style="height:1px; border-top:.4pt dotted #000000; border-left:0; border-right:0; border-bottom:0;">
ergibt im NS7.0, Doctype HTML4.01 strict, eine Linie aus Strichen

<hr style="height:1px; border-top:.5pt dotted #000000; border-left:0; border-right:0; border-bottom:0;">
ergibt im NS7.0, Doctype HTML4.01 strict, das selbe Bild wie mit .3pt.

<hr style="height:1px; border-top:.6pt dotted #000000; border-left:0; border-right:0; border-bottom:0;">
ergibt im NS7.0, Doctype HTML4.01 strict, eine Art Punkt-Strich-Punkt-Linie

<hr style="height:1px; border-top:.7pt dotted #000000; border-left:0; border-right:0; border-bottom:0;">
ergibt im NS7.0, Doctype HTML4.01 strict, eine Art 5Punkt-dickerPunkt-5Punkt-Linie (sehr attraktiv ;-))

<hr style="height:1px; border-top:.8pt dotted #000000; border-left:0; border-right:0; border-bottom:0;">
ergibt im NS7.0, Doctype HTML4.01 strict, keine Linie

Hast Du eine Erklärung dafür? Oder irgendwer sonst?

viele Grüße

Axel

[Thomas J.S.]

Hallo Axel,

Das habe ich nicht gemeint. Mich würde _wirklich_ interessieren, _warum_ Deine Lösung funktioniert.

*ggg*

Ich hab da jetzt mal rumprobiert, und _Deine_ Lösung sieht wirklich ähnlicher aus im IE und NS7.0. Der NS7.0 macht bei meiner Lösung kleinere dots als der IE. Aber wie in aller Welt ist das zu Erklären?

Der IE macht in der Tat eher kürzere Striche als Pukte. Das ist aber im IE immer so.

<hr style="height:1px; border-top:.2pt dotted #000000; border-left:0; border-right:0; border-bottom:0;">
ergibt im NS7.0, Doctype HTML4.01 strict, keine Linie

Mit der DOCTYPE hat das nichts zu tun, der NS hat offenbar andere Ausffasung von der Auflösung als der IE oder Opera z.B.. Wenn du bei dir die Auflösung (nicht in NS, das wirk überhaupt nicht) z.B. auf 200dpi umstellst, zeigt auch der NS (bzw. ich habe es mit Mozilla 1.2.1 verucht)  auch 0.2pt an.

Grüße
Thomas

[Tetrapak]

hr {
height:1px;
border:dotted 0.3pt #000000;

Danke.