Html CSS引导行Flex和显示问题

我试图建立一个简单的网页与2列md-6，他们需要相同的高度没有设置的高度。我已经在行中添加了样式显示flex，所以现在它的高度相等，只是col-md-6中的元素出现了问题

在第二个col-md-6中，我有一个很长的HTML表单，这将决定另一个col-md-6的长度（目前是）。在我的第一个col-md-6中有两个部分，第一部分由徽标和文本组成，第二部分是背景图像，我希望占据剩余的高度。最好的方法是什么

这就是我到目前为止所做的

<div class="container-fluid">

    <div class="row" style="display: flex;">

            <div class="col-md-6">

                <div class="info">

                    <!-- Logo and Text -->

                </div>

                <div class="background">

                    <!-- Background Image -->

                </div>


            </div>
            <div class="col-md-6">

                <!-- Long Form Here -->


            </div>      

    </div>


</div> 

---

还将第一个

col-md-6

显示为：flex

和

flex direction:column

。在背景图像div上使用

flex-grow:1

标志和文字
背景

这是一些性感的东西！

<div class="container-fluid">
    <div class="row bg-info" style="display: flex;">
            <div class="col-md-6" style="display: flex;flex-direction:column">
                <div class="info">
                    Logo and Text
                </div>
                <div class="background">
                    Background
                </div>
            </div>
            <div class="col-md-6">

            </div>      
    </div>
</div>