esse est percipi
Das Weblog eines Grafikdesigners. Seit 2003.

esse est percipi

Einfach gute Mac-Apps.

Von einem unabhängigen Entwickler,
der sie täglich selbst nutzt.

Blog Apps

Impressum/Datenschutz/AGB

Webdesign | Montag, 12. Januar 2004

Border-style 1px dotted im Win-Explorer

Wie wahrscheinlich jeder Webdesigner weiß, hat Win IE seit einigen Versionen einen Rendering Bug, der border-style: 1px dotted nicht als gepunktete, sondern als gestrichelte Linie darstellt.

Gestern habe ich diese Website seit längerer Zeit mal wieder in eben diesem Win IE angeschaut und festgestellt, dass gestrichelte Linien unter Links einfach bescheiden aussehen. Also habe ich für IE Browser einen CSS work-around mit einem 2×1 Pixel großen GIF gebastelt:

a:link {

  color: #660;

  text-decoration: none;

  border: none;

  background: url(/bilder/dotted_666600.gif) repeat-x bottom left;

  padding-bottom: 2px;

}

Das funktioniert auch ganz gut, nur leider kann Win IE auch das (wie so vieles andere) wieder nicht ganz fehlerfrei, weil offensichtlich die Eigenschaft background-position nicht richtig interpretiert wird: bei einem über mehrere Zeilen laufenden Linktext wird das Hintergrundbild nur in der letzten Zeile angezeigt – der Link wird also auch nur in der letzten Zeile unterstrichen, wie man (im Win IE) in der Sidebar schön sehen kann.

Im Mac IE gibt es übrigens keine Probleme. Falls ich etwas übersehen haben sollte, wäre ich für entsprechende Hinweise dankbar.

Kommentare:

Bei den Kommentaren handelt es sich um fremde Inhalte, die sich „esse est percipi“ nicht zueigen macht. Verantwortlich für den Inhalt eines Kommentars ist der jeweilige Verfasser.

Thomas Montag, 12. Januar 2004, 10:57 Uhr

Hallo Michael,

ueber einen Umweg bekommst du aber das transparente PNG (grauer Balken oben) deines Weblogs auch im IE hin:den Filter AlphaImageLoader

Beispiel:

ANFANG DIV

ID="Beliebig" STYLE="position:absolute; left:140px; height:400; width:400;

filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(

src='image.png', sizingMethod='scale');" >

ENDE DIV

Michael Preidel Montag, 12. Januar 2004, 12:52 Uhr

Stimmt, ich hatte mir sogar mal einen entsprechenden Artikel auf der How To Create-Site gebookmarked. Allerdings kommt ja beim Win IE noch das Problem dazu, dass das Attribut fixed nicht interpretiert wird – solange der Header mitscrollt, nutzt mir also die Transparenz nichts.

Aber es gibt ja auch ein paar Hacks, um Win IE das fixed Attribut beizubringen. Und da ich die Javascript-CSS-Weiche ohnehin mal entsorgen will (über die conditional comments kann ich ja ein Stylesheet nur für Win IE ab Version 5 nachladen) werde ich das alles demnächst mal in Angriff nehmen…