How to create a border around elements in flex box

The border I'm drawing now, fills the whole width of the screen. I would like it to shrink to the size of the child elements

i have tried adding a border property to the flex box, but as i said, it fills the whole screen.

 <div class="mainThing">
        <div class="thing_row">
            <div class="thing_img">
                <img src="url" height="60">
            </div>

            <div class="thing_texts">
                <div class="noa_txt">NOW ON AIR</div>
                <div class="main_txt">The Royal Sunrise</div>
                <div class="peeps_txt">Meth, Pavan, Thinula and Jayavi</div>
            </div>
        </div>
    </div>

.thing_row{
    display: flex;
    flex-direction: row;
    align-items: flex-start;
    justify-content: flex-start;

    border: solid black;

    flex-basis: content;
}

I expected the border to be drawn, tightly fitting the child elements but it fills up the whole width of the screen