svg in grid-area skaliert nicht

[michaah]

@@michaah

Meine svg-Graphik (im Smartphoneschlauch 98% der Breite füllend) schrumpft hier auf fast nicht auffindbare 4x4px zusammen. Vermutlich sind das einfach die vier Ecken. Im Quellcode wurde zunächst **n

Kann ich nicht nachvollziehen. Guckst du.

Ich nun schon etwas, aber nur in Teilen, und ohne Lösung:

1. mein img.svg ist kein Kindelement, sondern ein Kindeskind: section/aside/img.svg

EDIT://

Got it!

Mein Kindelement hatte kein width. Warum das in der Normalfassung dennoch klappt (kein grid!), hier im grid dann aber nicht habe ich noch nicht verstanden. Da ist noch vieeeel Luft nach oben.

/Edit://

Das erklärt mir aber immer noch nicht, warum es nicht skaliert.

2. die 4x4 Pixel sind der border: 2px solid <farbe>, vom img.svg selbst ist also 0,0 sichtbar.

Jede CSS-Eigenschaft hat zu jeder Zeit einen bestimmten Wert. ...

3. Ja, das min-width: 0 und min-height: 0 wurde wohl vom inspector auf Grund von Änderungen generiert, die ich im Inspector testweise vorgenommen hatte. In soweit hat sich dieser Aspekt erledigt.

Ich hoffe ja dass es für das nicht skalieren eine offensichtliche Erklärung gibt, ohne dass ihr ne Glaskugel braucht, sonst muß ich den Schrott auch noch falsch nachbauen ... 😉 , was möglicherweise gar nicht so einfach ist.

Gruß und Danke für deine Mühen.

M

PS: In dem codepen kann ich zwar als nicht angemeldeter user editieren, das dann aber nicht ausführen, was die Editierbarkeit etwas absurd macht. Oder geht das doch (als nicht angemeldeter user)? Ich habe das dann in eine lokale Testdatei kopiert und dann dein svg auch eine Ebene tiefer gesteckt. Das skaliert immer noch, wenn auch kleiner.