Frage

Ich versuche, einen monospacierten ASCI -Tisch zu bekommen, wie hier zu sehen ist:u003Cpre>Tag- und CSS-Schriftfamilie

Das funktioniert für mich in allen Browsern, außer IE8.

Auf IE8 werden alle Räume in einen Raum komprimiert. (so verschwinden die Spalten)

Irgendwelche Ideen, warum IE8 das tut?

Danke im Voraus,

Alex

War es hilfreich?

Lösung

Hinzufügen white-space:pre zu Ihrem Element, um weiße Raumzeichen zu erhalten.

Andere Tipps

Das Standardverhalten von HTML besteht darin, mehrere weiße Räume auf einen einzelnen Raum zu komprimieren, sofern dies nicht ausdrücklich gesagt wird.

Der Weg, es nicht zu tun, besteht darin, das CSS zu verwenden white-space Eigentum. Der Wert, den Sie wahrscheinlich suchen, besteht darin, es aufzunehmen white-space:pre;, die ein Element festlegen, um den gesamten Weißraum anzuzeigen, ohne ihn zu komprimieren.

Sie können natürlich auch die verwenden <pre> Tag selbst, der hat white-space:pre; Standardmäßig eingestellt. Beachten Sie, dass dies in Ihren Stylesheets überschrieben werden kann. Wenn a <pre> Tag funktioniert nicht, das ist wahrscheinlich der Grund. (Wenn dies geschieht, können Sie das Fenster für Entwickler -Tools verwenden, um die auf das Element angewendeten Stile zu untersuchen.)

Zusätzlich zu white-space:pre;, Es gibt ein paar andere Werte der white-space Eigenschaft, die Sie je nach Ihren Anforderungen auch verwenden können: pre-wrap und pre-line.

Mit Beispielen finden Sie hier mehr über die Unterschiede zwischen ihnen: hier: http://www.quirksmodode.org/css/whITespace.html

Ich hoffe, das hilft.

Ich habe es versucht und es hat funktioniert ... (vielleicht hilft es), dann reparieren Sie den Rest mit Stilen.

<svg width="600" height="150" font-family="monospace"  xml:space="preserve">
<defs>
<style type="text/css">
<![CDATA[ /* ADD CLASSES */
.font{text-anchor: start; font-size: 12px;font-weight: normal; font-family: "DejaVu Sans Mono", sans-serif;white-space: pre-wrap;}
]]>
</style>
</defs>
Lizenziert unter: CC-BY-SA mit Zuschreibung
Nicht verbunden mit StackOverflow
scroll top