What happened to the video?

Question

css

Why is the height of the video not equal to the height of the column?
How to fix?

<div class="com-md-12 col-lg-6 text-center">
                <div class="embed-responsive">
                    <iframe class="embed-responsive-item" src="https://www.youtube.com/embed/-94wMMy8v2U" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" data-gtm-yt-inspected-2340190_699="true" allowfullscreen></iframe>
                </div>
            </div>

Answer 1

First, replace the class com-md-12 with col-md-12.
And on the subject:
Something interrupts your bootstrap styles. It's hard to tell without code. Do you have a link to the site?