How to stretch 2 blocks to full width?

Question

css

How to stretch these 2 blocks to full width using flex?
I get it like this:

<div class="album-col">
            <div class="album-it">
                <h2 class="album-title">featured album</h2>
            </div>
            
            <div class="album-it">
                <a href="#"><img src="img/HUGO_Free-Landing-Page_03.jpg" alt="BEAT"></a>
            </div>
        </div>

.album-col{
    
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    justify-content: space-between;
}

.album-it{
    width: 720px;
    height: 480px;
    
    
}

.album-title{
    font-size: 48px;
    
    text-transform: capitalize;
    color: #252525;
    
    font-weight: lighter;
}

The result should be like this:

Answer 1

.album-it{
    height: 480px;
    flex: 1 0 auto;
}