I am trying to display some images with their names right under them in a view-style similar to Windows File Explorer similar to this
style I am trying to replicate

Currently I am using a QuickGrid to display the information and I have the following code. I’ve tried implementing a flexbox inside of the grid, and that allows me to have the image have it’s name under the thumbnail, but the next image goes under it, instead of beside it

<QuickGrid Items="@Images">
    <TemplateColumn>
        @{
            var item= (context as Doc);
        }
        <div style="display: flex; flex-direction: column; align-items: center;">
            @if (currItem.Thumbnail != null)
            {
                <div style="margin-bottom: 5px;">
                    <img src="@($"data:application/octet-stream;base64,{Convert.ToBase64String(currItem.Thumbnail)}")" alt="Thumbnail" style="width: 64px; height: 64px;" />
                </div>
            }
            <div>
                @currItem.Name
            </div>
        </div>
    </TemplateColumn>
</QuickGrid>

I’ve tried adjusting where I do the styling but that hasn’t really made any progress.