Hallo!
Ich habe folgende Problem:
Ich hätte gerne, dass sich ein Bild an seinen Container anpasst. Der Container soll sich vertikal über den verbleibenden Rest des Dokuments erstrecken (hier der Einfachheit halber über das gesamte vertikale Dokument, da ich weitere Elemente mal weggelassen habe). In dem Container befindet sich ein Bild, das sich an die Maße des Parent-Elements (Container) anpassen sollte, was es allerdings nicht tut (das Bild ist ein sehr großes SVG, welches sich aus irgendeinem Grund nicht anpasst, sondern ein overflow produziert).
Der Code bisher:
body {
margin: 0;
padding: 0;
width: 100vw;
height: 100vh;
display: flex;
flex-direction: column;
}
#container {
flex: 1 0 auto;
}
#container img {
max-width: 100%;
max-height: 100%;
}
<div id="container"><img src="Vektorgrafik.svg" alt=""></div>
<!-- Bild sollte vertikal maximal der Fensterhöhe entsprechen -->
Danke für euren Rat!