Boostrap 5, How can I add multiple elements in a column

Issue

I have this Bootstrap 5 code that shows some images like in this link in a grid, the images are affected by a few CSS code.

#projects img {
  width: 100%;
  height: 100%;
}

<section id="projects">
            <div class="container text-center">
                <h4 class="fw-bold mb-3 border-bottom border-3">Mis Proyectos</h4>
                <div class="row g-4">
                    <div class="col-md-6">
                        <img
                        src="./images/cardcomponent.png" 
                        alt="card component"
                        class="rounded-3"
                        >
                    </div>
                    <div class="col-md-6">
                        <img
                        src="./images/yardsale.png" 
                        alt="yard sale"
                        class="rounded-3"
                        >
                    </div>
                    <div class="col-md-6">
                        <img
                        src="./images/qrcard.png" 
                        alt="web developer"
                        class="qr card"
                        >
                    </div>
                    <div class="col-md-6">
                      <img
                        src="./images/cardcomponent.png" 
                        alt="web developer"
                        class="rounded-3"
                        >
                    </div>
                </div>
            </div>
        </section>

I want to add a title <h6></h6> to each image.

<div class="col-md-6">
    <h6>Title</h6>
    <img
    src="./images/cardcomponent.png" 
    alt="card component"
    class="rounded-3"
    >
</div>

But for some reason, the title isn't included or recognized in the column, showing something like this, while this is similar to what i want to do.

Solution

@Emiliano Acevedo, Thanks to draw attention to the bug of bootstrap, I am sure the team must get those alignment issue fixed for row column.

Here's quick fix for the issue. <div class="row g-4 align-items-end"> You can fix the issue with adding item alignment in the row element.

I hope this helps.

CodePen Example

Answered By - Daksh Solanki