SVG und custom properties

[Matthias Scharwies]

guten Morgen,

Wir hatten es ja schon im internen Forum und am Stammtisch, ich habe doch noch ne Frage:

• SVG_und_Custom_Properties

  • Beispiel:SVG-CSS-4.html

Warum muss als Ergebnis der Berechnung mit calc() ein Wert mit px rauskommen, wenn normalerweise eine Zahl ausreicht, da es doch eine dimensionslose Größe ist.

Herzliche Grüße

Matthias Scharwies

[Rolf B]

Hallo Matthias,

dass Längen in SVG-Attributen einheitenlos sind, heißt nicht, dass sie es im CSS auch sind.

Firefox ist Spec-konform. MDN schreibt zwar ausdrücklich <number> als möglichen Wert für die CSS-Eigenschaft stroke-width, malt aber ein NONSTANDARD Ausrufezeichen dahinter. Man solle in die Kompatibilitätsinfos schauen. Aber da steht nichts.

Versuch macht kluch: Chrome versteht auch einheitenlose Werte. Zu Safari kann ich nichts sagen.

Rolf

[Matthias Scharwies]

Servus!

Hallo Matthias,

dass Längen in SVG-Attributen einheitenlos sind, heißt nicht, dass sie es im CSS auch sind.

Firefox ist Spec-konform. MDN schreibt zwar ausdrücklich <number> als möglichen Wert für die CSS-Eigenschaft stroke-width, malt aber ein NONSTANDARD Ausrufezeichen dahinter. Man solle in die Kompatibilitätsinfos schauen. Aber da steht nichts.

Versuch macht kluch: Chrome versteht auch einheitenlose Werte. Zu Safari kann ich nichts sagen.

Danke!

@JürgenB könntest du es mal ausprobieren?

Herzliche Grüße

Matthias Scharwies

[JürgenB]

Hallo Matthias,

im Safari liefern

stroke-width: calc(1.5px * var(--width));

und

stroke-width: calc(1.5 * var(--width));

das gleiche Ergebnis.

Gruß
Jürgen

[Matthias Scharwies]

Servus!

Hallo Matthias,

im Safari liefern

stroke-width: calc(1.5px * var(--width));

und

stroke-width: calc(1.5 * var(--width));

das gleiche Ergebnis.

Vielen Dank für's nachschauen!

Herzliche Grüße

Matthias Scharwies