Why does flex-box div not respect parent height? [closed]

This seems really straight forward and I guess I must be missing something quite obvious, but why does the flex div here not respect the 300px set by its parent?

<div className="max-h-[300px] h-[300px] bg-cyan-200 w-full"><div className="flex flex-1 flex-col overflow-y-scroll space-y-4 h-full"><div className="h-[75px] w-full bg-lime-400"></div><div className="h-[75px] w-full bg-amber-400"></div><div className="h-[75px] w-full bg-lime-400"></div><div className="h-[75px] w-full bg-amber-400"></div><div className="h-[75px] w-full bg-lime-400"></div><div className="h-[75px] w-full bg-amber-400"></div></div></div>

As you can see in this image all 75px height DIVs are visible. What am I missing here to make the flex div not overflow its container?