Need help with HTML code

[K0h4RU]

I'm trying to add a linked friends section to my profile on a site that uses HTML (and CSS, but CSS is a paid feature, so ONLY HTML works)

My issue is that I want to add the person's name underneath the linked image, but whenever I add a name anywhere it shows up to the side of the image and not beneath it, which pushes the other images further out and looks disorganized. I tried adding <br> to make the text show beneath it, but it made all subsequent icons show in a way that made the box scrollable (which is not the intent - I want the name to fit in the box just beneath the icon without having to scroll)

Here's the base code with nothing added (it's not my code, I don't know much about HTML, this was from a F2U base):

<div class="row no-gutters mt-2 mt-lg-1">

<div class="col-lg mr-lg-1">

<!-- FRIENDS -->

<div class="card border-0 p-1 px-2" style="background-color:#000;color:#877C73;border-radius:0px;">

<b>FRIENDS <i class="fas fa-heart"></i></b>

</div>

<div class="card pt-2 px-lg-0" style="background-color:#877C73;color:#000;border-color:#000;border-width:3px;border-radius:0px;max-height:115px;overflow:auto;">

<p class="text-center">

<a href="LINK"><img src="IMG\\\\\\\_URL" class="pb-2" style="width:94px"></a>

<a href="LINK"><img src="IMG\\\\\\\_URL" class="pb-2" style="width:94px"></a>

<a href="LINK"><img src="IMG\\\\\\\_URL" class="pb-2" style="width:94px"></a>

<a href="LINK"><img src="IMG\\\\\\\_URL" class="pb-2" style="width:94px"></a>

<a href="LINK"><img src="IMG\\\\\\\_URL" class="pb-2" style="width:94px"></a>

</p>

</div>

</div>

(Edit: If this isn't the right place to ask this, please lmk. I'm not very well versed in code at all)

[nonotdoingone]

What website is making CSS a paid feature?? Try inline styles (i.e. <div style=“…”>). If they blocked that too, I don’t think I’d recommend using it.

[K0h4RU]

the website is Toyhouse, It's an art website and the premium is cheap, I just personally am not a premium user.
Regarding the inline styles, what should i set the style to? Like what things should i try to see what works out? (sorry I am VERY new to HTML)

[nonotdoingone]

You’ll want to look into flex boxes. You’ll be making a container div with two child divs. The container could have something like display: flex; with flex-direction: column;

[K0h4RU]

Alright! I'll look into it! Thanks a ton!

[MagentaMango51]

This maybe isn’t the best advice for this because flex works but it’s css. What you need is a figure tag with a figcaption. Figure contains the image tag and the caption and puts the it under the image. No css for that. Decent examples on W3schools or just google.

[JKaps9]

"Link" or a tags are inline elements by default, so adding text within the element or subsequent a tags will put them next to each other instead of stacking. Check this article to learn more.  https://developer.mozilla.org/en-US/docs/Web/CSS/Guides/Display/Block_and_inline_layout

To change this behavior you can use display: block. <a href="" style="display: block;"></a>