Help Image Alignment Help

[The Great Goon Goblin]

Hello! So I need some help with trying to align my images. The three small images below I'm trying to have them sit next to each other while being centered. If that makes sense.

[div class=img]
[class=img]
height:510px;
width:450px;
background:url('https://i.imgur.com/nXSPgii.png?1');
margin:auto;
background-size:100%;
position:relative;
border: 1px solid black;
[/class]
[/div]

Spoiler: code

[div class=img]
[class=img]
height:510px;
width:450px;
background:url('https://i.imgur.com/nXSPgii.png?1');
margin:auto;
background-size:100%;
position:relative;
border: 1px solid black;
[/class]
[/div]

 

[RI.a]

A simple way to do it is adding row and columns. Just add it after your div like so

[div=position:relative; background-size:20%; width:150px; margin:auto;][row][column=span2]

You can adjust the width of the column from 1 to 8. 8 being the widest ie the whole width of the screen.
Add more columns in front of each [ img]. Close the column with [/ column] and row with [/ row]

 

[The Great Goon Goblin]

Hmm, for some reason it still didn't work. All three images are still aligned in the center, going down the y-axis.

 

[deer]

The Great Goon Goblin ; was this what you were looking to do? in the div before i made the row and column code, i took out the background-size in the div because it wasn't necessary since the pictures aren't a "background". however, i did change the width size to "50%" to make all photos smaller but still see-able since "150px" width for the pictures was quite tiny, unless that was what you were going for? but, here is the code if you were looking to get the pictures side by side! note: on mobile, when using the column code, the pictures will be vertical as it's "mobile friendly" ; you can use divs, but it will cause the code the code to not necessarily be mobile friendly depending how much you play with the code

[div class=img]
[class=img]
height:510px;
width:450px;
background:url('https://i.imgur.com/nXSPgii.png?1');
margin:auto;
background-size:100%;
position:relative;
border: 1px solid black;
[/class]
[/div]
[div=height: 20px; overflow: hidden; width: 450px; margin: auto;][div=margin-top: -50px][MEDIA=youtube]sA5hj7wuJLQ[/MEDIA][/div][/div]
[div=position:relative; width: 50%; margin:auto;]
[row][column=span1][color=transparent]x[/color][/column][column=span2][img]https://i.imgur.com/3t7xA1A.png[/img][/column][column=span2][img]https://i.imgur.com/QVP1x5j.png[/img][/column][column=span2][img]https://i.imgur.com/B3iAwMd.png[/img][/column][column=span1][color=transparent]x[/color][/column][/row]
[/div]

 

[The Great Goon Goblin]

deer Yes! Thank you! That's exactly what I was looking for. It was bothering me why I couldn't figure out.