Servus! > Hallo, > ich möchte eine Flagge von der Breite 0 auf ihre Gesamtbreite wachsenlassen (Höhe bleibt gleich). > Ich habe verschiedene Varianten versucht, die letzte hier: > > Leider klappt es nicht. Könnt Ihr mir einen Tipp geben? Versuch mal das, ob dir das passt: ~~~css svg { height: 200px; animation: wachsen 5s linear; width: 0; animation-fill-mode: forwards; } @keyframes wachsen { 0 { width: 0; } 100% { width: 300px; } } ~~~ Ein Anfangswert für width schon bei svg; [animation-fill-mode](https://wiki.selfhtml.org/wiki/Animation#animation-fill-mode), damit es nicht zurückspringt. Die Höhe skaliert aber mit. Herzliche Grüße Matthias Scharwies -- Es gibt viel zu tun: *[ToDo-Liste](http://wiki.selfhtml.org/wiki/Kategorie:ToDo)*{: style="display:list-item;list-style-type:disc;font-style:normal;margin:1em 0 0 2em;"}

Servus! > Hallo, > ich möchte eine Flagge von der Breite 0 auf ihre Gesamtbreite wachsenlassen (Höhe bleibt gleich). > Ich habe verschiedene Varianten versucht, die letzte hier: > > Leider klappt es nicht. Könnt Ihr mir einen Tipp geben? Versuch mal das, ob dir das passt: ~~~css svg { height: 200px; animation: wachsen 5s linear; width: 0; animation-fill-mode : forwards; } @keyframes wachsen { 0 { width: 0; } 100% { width: 300px; } } ~~~ Ein Anfangswert für width schon bei svg; [animation-fill-mode](https://wiki.selfhtml.org/wiki/Animation#animation-fill-mode), damit es nicht zurückspringt. Die Höhe skaliert aber mit. Herzliche Grüße Matthias Scharwies -- Es gibt viel zu tun: *[ToDo-Liste](http://wiki.selfhtml.org/wiki/Kategorie:ToDo)*{: style="display:list-item;list-style-type:disc;font-style:normal;margin:1em 0 0 2em;"}

Servus! > Hallo, > ich möchte eine Flagge von der Breite 0 auf ihre Gesamtbreite wachsenlassen (Höhe bleibt gleich). > Ich habe verschiedene Varianten versucht, die letzte hier: > > Leider klappt es nicht. Könnt Ihr mir einen Tipp geben? Versuch mal das, ob dir das passt: ~~~css svg { height: 200px; animation: wachsen 5s linear; width: 0; animation-fill-mode : forwards; } @keyframes wachsen { 0 { width: 0; } 100% { width: 300px; } } ~~~ Ein Anfangswert für width schon bei svg; [animation-fill-mode](https://wiki.selfhtml.org/wiki/Animation#animation-fill-mode), damit es nicht zurückspringt. Herzliche Grüße Matthias Scharwies -- Es gibt viel zu tun: *[ToDo-Liste](http://wiki.selfhtml.org/wiki/Kategorie:ToDo)*{: style="display:list-item;list-style-type:disc;font-style:normal;margin:1em 0 0 2em;"}