Need helping to figure out the reason: Flexbox

Hi all, I need help with Flexbox. Here is my slider, I want to set that each of item in the slider takes all of the space of the frame. But i don't know it didn't work like what I expected And here is my CSS Please help me with it .modal-behind_instagramwindow { background-color: rgba(39, 39, 41, 0.6); position: fixed; top: 0; left: 0; z-index: 1; width: 100%; height: 100%; overflow: auto; padding: 40px 100px;
} .instagramwindow { margin: auto; display: block; /* width: 100%; height: 100%; /
}
.instagram-window__list { display: flex; flex-wrap: nowrap; overflow: auto; / width: 100%; */ height: auto; margin: 0; border: 2px solid rebeccapurple;
} .instagram-windowitem { flex-grow: 1; } .instagramwindow-mobile { display: none; } .instagramwindow-fullscreen { border-radius: 40px; display: flex; width: 100%; max-width: 1200px; gap: 20px; background-color: #fff; border: 5px solid yellow; } .instagramwindowitem-img { width: 50%; } .instagramwindowitem-detail { width: 50%; } .instagramwindow-img{ border: 2px solid greenyellow; max-width: 650px; height: auto; }
.instagramwindowitem--header { display: flex; align-items: center; justify-content: space-between; gap: 10px; position: relative; }