Fivestar4everMVP (OP)
Legendary
Offline
Activity: 2366
Merit: 1079
Leading Crypto Sports Betting & Casino Platform
|
Hi guys, i want to make a post which contains many images, and then I thought it did be nice and neat if I align the images horizontally. That lead me into searching for the right code to use but nothing I have found seems to work. Below are the list of codes I've tried but none of them worked - 1. [img align=left/right/center]<image link>[/img] 2. [float=left/right/center][img]<image link>[/img][/float] 3. [img float=left/right/ceter]<image link>[/img] 4. [img style="float:left/right/center"]<image link>[/img] I even tried something like this - [img src="<image link>" align="left/right/center"][/img] But it still doesn't work, I would appreciate any one who knows how to get around this.
|
..Stake.com.. | | | ▄████████████████████████████████████▄ ██ ▄▄▄▄▄▄▄▄▄▄ ▄▄▄▄▄▄▄▄▄▄ ██ ▄████▄ ██ ▀▀▀▀▀▀▀▀▀▀ ██████████ ▀▀▀▀▀▀▀▀▀▀ ██ ██████ ██ ██████████ ██ ██ ██████████ ██ ▀██▀ ██ ██ ██ ██████ ██ ██ ██ ██ ██ ██ ██████ ██ █████ ███ ██████ ██ ████▄ ██ ██ █████ ███ ████ ████ █████ ███ ████████ ██ ████ ████ ██████████ ████ ████ ████▀ ██ ██████████ ▄▄▄▄▄▄▄▄▄▄ ██████████ ██ ██ ▀▀▀▀▀▀▀▀▀▀ ██ ▀█████████▀ ▄████████████▄ ▀█████████▀ ▄▄▄▄▄▄▄▄▄▄▄▄███ ██ ██ ███▄▄▄▄▄▄▄▄▄▄▄▄ ██████████████████████████████████████████ | | | | | | ▄▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▄ █ ▄▀▄ █▀▀█▀▄▄ █ █▀█ █ ▐ ▐▌ █ ▄██▄ █ ▌ █ █ ▄██████▄ █ ▌ ▐▌ █ ██████████ █ ▐ █ █ ▐██████████▌ █ ▐ ▐▌ █ ▀▀██████▀▀ █ ▌ █ █ ▄▄▄██▄▄▄ █ ▌▐▌ █ █▐ █ █ █▐▐▌ █ █▐█ ▀▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▀█ | | | | | | ▄▄█████████▄▄ ▄██▀▀▀▀█████▀▀▀▀██▄ ▄█▀ ▐█▌ ▀█▄ ██ ▐█▌ ██ ████▄ ▄█████▄ ▄████ ████████▄███████████▄████████ ███▀ █████████████ ▀███ ██ ███████████ ██ ▀█▄ █████████ ▄█▀ ▀█▄ ▄██▀▀▀▀▀▀▀██▄ ▄▄▄█▀ ▀███████ ███████▀ ▀█████▄ ▄█████▀ ▀▀▀███▄▄▄███▀▀▀ | | | ..PLAY NOW.. |
|
|
|
BlackHatCoiner
Legendary
Offline
Activity: 1624
Merit: 7967
Bitcoin is a royal fork
|
If you want to place it in the center, use: [center][img]IMAGE_URL[/img][/center] If you want to place it right, use: [right][img]IMAGE_URL[/img][/right] If you want to place it left, there's this left align, but I, yet, fail to understand what's the purpose, everything's already left aligned: [left][img]IMAGE_URL[/img][/left]
|
|
|
|
DdmrDdmr
Legendary
Offline
Activity: 2422
Merit: 10978
There are lies, damned lies and statistics. MTwain
|
![](https://bitcointalk.org/Themes/custom1/images/post/xx.gif) |
April 19, 2022, 06:34:34 PM |
|
<...>
It’s really going to depend on what type of layout you want to make with the images. Since you mention that you want to include many images, perhaps this post can serve as a basis: https://bitcointalk.org/index.php?topic=5142007.0It displays a bunch of images from bitcoin movies and documentaries + books in an organized manner, with the aid of a table structure.
|
|
|
|
KingsDen
Legendary
Offline
Activity: 1204
Merit: 1072
Goodnight, o_e_l_e_o 🌹
|
![](https://bitcointalk.org/Themes/custom1/images/post/xx.gif) |
April 19, 2022, 08:00:40 PM |
|
<Snip>
I think what Op meant is not to align individual image, what he meant is to place many images side by side. In CSS, it could be achieved by using the grid command {Display: grid; Grid-template-columns: 1fr 1fr 1fr;} But I don't know the BBcode command for it. It displays a bunch of images from bitcoin movies and documentaries + books in an organized manner, with the aid of a table structure.
This is a great help, creating table columns and centring each image inside the columns.
|
|
|
|
R |
▀▀▀▀▀▀▀██████▄▄ ████████████████ ▀▀▀▀█████▀▀▀█████ ████████▌███▐████ ▄▄▄▄█████▄▄▄█████ ████████████████ ▄▄▄▄▄▄▄██████▀▀ | LLBIT | | | 4,000+ GAMES███████████████████ ██████████▀▄▀▀▀████ ████████▀▄▀██░░░███ ██████▀▄███▄▀█▄▄▄██ ███▀▀▀▀▀▀█▀▀▀▀▀▀███ ██░░░░░░░░█░░░░░░██ ██▄░░░░░░░█░░░░░▄██ ███▄░░░░▄█▄▄▄▄▄████ ▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀ | █████████ ▀████████ ░░▀██████ ░░░░▀████ ░░░░░░███ ▄░░░░░███ ▀█▄▄▄████ ░░▀▀█████ ▀▀▀▀▀▀▀▀▀ | █████████ ░░░▀▀████ ██▄▄▀░███ █░░█▄░░██ ░████▀▀██ █░░█▀░░██ ██▀▀▄░███ ░░░▄▄████ ▀▀▀▀▀▀▀▀▀ |
| | | | | | .
| | | ▄▄████▄▄ ▀█▀▄▀▀▄▀█▀ ▄▄░░▄█░██░█▄░░▄▄ ▄▄█░▄▀█░▀█▄▄█▀░█▀▄░█▄▄ ▀▄█░███▄█▄▄█▄███░█▄▀ ▀▀█░░░▄▄▄▄░░░█▀▀ █░░██████░░█ █░░░░▀▀░░░░█ █▀▄▀▄▀▄▀▄▀▄█ ▄░█████▀▀█████░▄ ▄███████░██░███████▄ ▀▀██████▄▄██████▀▀ ▀▀████████▀▀ | . ▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄ ░▀▄░▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄░▄▀ ███▀▄▀█████████████████▀▄▀ █████▀▄░▄▄▄▄▄███░▄▄▄▄▄▄▀ ███████▀▄▀██████░█▄▄▄▄▄▄▄▄ █████████▀▄▄░███▄▄▄▄▄▄░▄▀ ████████████░███████▀▄▀ ████████████░██▀▄▄▄▄▀ ████████████░▀▄▀ ████████████▄▀ ███████████▀ | ▄▄███████▄▄ ▄████▀▀▀▀▀▀▀████▄ ▄███▀▄▄███████▄▄▀███▄ ▄██▀▄█▀▀▀█████▀▀▀█▄▀██▄ ▄██▀▄███░░░▀████░███▄▀██▄ ███░████░░░░░▀██░████░███ ███░████░█▄░░░░▀░████░███ ███░████░███▄░░░░████░███ ▀██▄▀███░█████▄░░███▀▄██▀ ▀██▄▀█▄▄▄██████▄██▀▄██▀ ▀███▄▀▀███████▀▀▄███▀ ▀████▄▄▄▄▄▄▄████▀ ▀▀███████▀▀ | | OFFICIAL PARTNERSHIP SOUTHAMPTON FC FAZE CLAN SSC NAPOLI |
[/quote] [center][table][tr][td][url=h
|
|
|
Falconer
Legendary
Offline
Activity: 2618
Merit: 1132
|
![](https://bitcointalk.org/Themes/custom1/images/post/xx.gif) |
April 19, 2022, 08:11:06 PM |
|
If you want to place it in the center, use: [center][img]IMAGE_URL[/img][/center] If you want to place it right, use: [right][img]IMAGE_URL[/img][/right] If you want to place it left, there's this left align, but I, yet, fail to understand what's the purpose, everything's already left aligned: [left][img]IMAGE_URL[/img][/left] OP, did this work for you? But I think it should work this time, so give it a try. Set the layout as you want but note that sometimes the image size must also be proportional to fit as you expect. Meaning, all that code will be useless if the image you post covers the entire page. If the image is too big, then adjust the size with additional code like: [img width=size_you_want]Image_Url[/img] [img height=size_you_want]Image_Url[/img]
|
| .SHUFFLE.COM.. | ███████████████████████ ███████████████████████ ███████████████████████ ███████████████████████ ███████████████████████ ███████████████████████ ███████████████████████ ███████████████████████ ███████████████████████ ███████████████████████ ███████████████████████ ███████████████████████ ███████████████████████ | ███████████████████████ ███████████████████████ ███████████████████████ ███████████████████████ ███████████████████████ ███████████████████████ ███████████████████████ ███████████████████████ ███████████████████████ ███████████████████████ ███████████████████████ ███████████████████████ ███████████████████████ | . ...Next Generation Crypto Casino... |
|
|
|
BlackHatCoiner
Legendary
Offline
Activity: 1624
Merit: 7967
Bitcoin is a royal fork
|
![](https://bitcointalk.org/Themes/custom1/images/post/xx.gif) |
April 19, 2022, 08:19:40 PM Merited by mprep (5), ABCbits (2) |
|
I think what Op meant is not to align individual image, what he meant is to place many images side by side. Right. They should use the table tag in the center then. If they want more space, they can use the empty character. (" ") ![](https://ip.bitcointalk.org/?u=https%3A%2F%2Fi.imgur.com%2FW9hbTRV.png&t=665&c=S5uFkb54zD5VFw) | ![](https://ip.bitcointalk.org/?u=https%3A%2F%2Fi.imgur.com%2FW9hbTRV.png&t=665&c=S5uFkb54zD5VFw) | ![](https://ip.bitcointalk.org/?u=https%3A%2F%2Fi.imgur.com%2FW9hbTRV.png&t=665&c=S5uFkb54zD5VFw) |
[center][table][td][img]https://i.imgur.com/W9hbTRV.png[/img][/td] [td][img]https://i.imgur.com/W9hbTRV.png[/img][/td] [td][img]https://i.imgur.com/W9hbTRV.png[/img][/td][/center] [center][table][td][img]https://i.imgur.com/W9hbTRV.png[/img][/td] [td] [img]https://i.imgur.com/W9hbTRV.png[/img][/td] [td] [img]https://i.imgur.com/W9hbTRV.png[/img][/td][/center]
Edit: I've no idea what the hell happened to the first image.
|
|
|
|
decodx
|
OP, in addition to what others have said, if you are planning to publish a large number of images and align them in a specific manner, it is best to use tables. Also, keep in mind that you can use width and height attributes to improve the results even further.
Edit: I've no idea what the hell happened to the first image.
I think that's a well-known table bug/glitch.
|
|
|
|
Xal0lex
Staff
Legendary
Offline
Activity: 2562
Merit: 2529
|
![](https://bitcointalk.org/Themes/custom1/images/post/xx.gif) |
April 19, 2022, 09:08:50 PM |
|
Edit: I've no idea what the hell happened to the first image.
![](https://ip.bitcointalk.org/?u=https%3A%2F%2Fi.imgur.com%2FW9hbTRV.png&t=665&c=S5uFkb54zD5VFw)
..................................... |
| ![](https://ip.bitcointalk.org/?u=https%3A%2F%2Fi.imgur.com%2FW9hbTRV.png&t=665&c=S5uFkb54zD5VFw) | ![](https://ip.bitcointalk.org/?u=https%3A%2F%2Fi.imgur.com%2FW9hbTRV.png&t=665&c=S5uFkb54zD5VFw) |
[center] [table] [tr] [td][img]https://i.imgur.com/W9hbTRV.png[/img] [table][tr][td][color=transparent].....................................[/color][/td][/tr][/table] [/td] [td][img]https://i.imgur.com/W9hbTRV.png[/img][/td] [td][img]https://i.imgur.com/W9hbTRV.png[/img][/td] [/tr] [/table] [/center] Something like that.
|
|
|
|
PX-Z
|
![](https://bitcointalk.org/Themes/custom1/images/post/xx.gif) |
April 19, 2022, 10:49:02 PM Last edit: November 14, 2023, 02:30:47 AM by PX-Z |
|
Also, the simple way is just order the images without any additional tags. Make sure that the size of the images is proportion or the same, put a space if necessary and next line/enter if you want the images show below or above. If you want to show them center then just put the images in the "center" tag ![](https://ip.bitcointalk.org/?u=https%3A%2F%2Ftalkimg.com%2Fimages%2F2023%2F11%2F14%2FzMD8C.png&t=665&c=0Tzkc1yxda739g) [img]https://talkimg.com/images/2023/11/14/zMD8C.png[/img] [img]https://talkimg.com/images/2023/11/14/zMD8C.png[/img]
|
|
|
|
tranthidung
Legendary
Offline
Activity: 2380
Merit: 4187
Farewell o_e_l_e_o
|
Also, the simple way is just order the images without any additional tags. Make sure that the size of the images is proportion or the same, put a space if necessary and next line/enter if you want the images show below or above. If you want to show them center then just put the images in the "center" tag ![](https://ip.bitcointalk.org/?u=https%3A%2F%2Fi.imgur.com%2FW9hbTRV.png&t=665&c=S5uFkb54zD5VFw) [img]https://i.imgur.com/W9hbTRV.png[/img] [img]https://i.imgur.com/W9hbTRV.png[/img]
This approach only works well if image size is similar (almost). If image sizes are different, then you will have unaligned rows because basically it is not set up as a table. With a table format, you will have all align in row and column, no matter what size of images. Additional parameters should be included into your approach, with both width and height parameters. Something like [img width=300 height=200]https://i.imgur.com/W9hbTRV.png[/img] [img width=300 heigth=200]https://i.imgur.com/W9hbTRV.png[/img]
Else, in case image sizes are different, you will get something like below ![](https://ip.bitcointalk.org/?u=https%3A%2F%2Fi.imgur.com%2FW9hbTRV.png&t=665&c=S5uFkb54zD5VFw) ![](https://ip.bitcointalk.org/?u=https%3A%2F%2Fi.imgur.com%2FW9hbTRV.png&t=665&c=S5uFkb54zD5VFw) [img width=200 height=100]https://i.imgur.com/W9hbTRV.png[/img] [img width=200 height=100]https://i.imgur.com/W9hbTRV.png[/img]
|
|
|
|
o_e_l_e_o
In memoriam
Legendary
Offline
Activity: 2268
Merit: 18697
|
Note that you do not need to specify both a height and a width, and by doing so you will usually distort your picture unnecessarily. If you want neat rows on a table, then just specify the same height for every image and the forum will automatically scale the width to match while keeping the same ratio.
|
|
|
|
Fivestar4everMVP (OP)
Legendary
Offline
Activity: 2366
Merit: 1079
Leading Crypto Sports Betting & Casino Platform
|
![](https://bitcointalk.org/Themes/custom1/images/post/xx.gif) |
April 20, 2022, 09:44:23 AM Last edit: December 16, 2023, 07:02:02 PM by Fivestar4everMVP Merited by vapourminer (2) |
|
OP, did this work for you? But I think it should work this time, so give it a try. No, the first code from @BlackHatcoiner didn't work, the images were being knocked over to the next line, and I needed them to align left, center, right. But then, the second code which had to do with using tables worked exactly the way I wanted it. Special thanks to every one that commented, and special thanks to @BlackHatbitcoiner, I got exactly the answer I needed and also learnt something new, I will come back to appreciate you guys in a much more better way, am currently out of water(if you understand what I mean) 😁.
|
..Stake.com.. | | | ▄████████████████████████████████████▄ ██ ▄▄▄▄▄▄▄▄▄▄ ▄▄▄▄▄▄▄▄▄▄ ██ ▄████▄ ██ ▀▀▀▀▀▀▀▀▀▀ ██████████ ▀▀▀▀▀▀▀▀▀▀ ██ ██████ ██ ██████████ ██ ██ ██████████ ██ ▀██▀ ██ ██ ██ ██████ ██ ██ ██ ██ ██ ██ ██████ ██ █████ ███ ██████ ██ ████▄ ██ ██ █████ ███ ████ ████ █████ ███ ████████ ██ ████ ████ ██████████ ████ ████ ████▀ ██ ██████████ ▄▄▄▄▄▄▄▄▄▄ ██████████ ██ ██ ▀▀▀▀▀▀▀▀▀▀ ██ ▀█████████▀ ▄████████████▄ ▀█████████▀ ▄▄▄▄▄▄▄▄▄▄▄▄███ ██ ██ ███▄▄▄▄▄▄▄▄▄▄▄▄ ██████████████████████████████████████████ | | | | | | ▄▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▀▄ █ ▄▀▄ █▀▀█▀▄▄ █ █▀█ █ ▐ ▐▌ █ ▄██▄ █ ▌ █ █ ▄██████▄ █ ▌ ▐▌ █ ██████████ █ ▐ █ █ ▐██████████▌ █ ▐ ▐▌ █ ▀▀██████▀▀ █ ▌ █ █ ▄▄▄██▄▄▄ █ ▌▐▌ █ █▐ █ █ █▐▐▌ █ █▐█ ▀▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▄▀█ | | | | | | ▄▄█████████▄▄ ▄██▀▀▀▀█████▀▀▀▀██▄ ▄█▀ ▐█▌ ▀█▄ ██ ▐█▌ ██ ████▄ ▄█████▄ ▄████ ████████▄███████████▄████████ ███▀ █████████████ ▀███ ██ ███████████ ██ ▀█▄ █████████ ▄█▀ ▀█▄ ▄██▀▀▀▀▀▀▀██▄ ▄▄▄█▀ ▀███████ ███████▀ ▀█████▄ ▄█████▀ ▀▀▀███▄▄▄███▀▀▀ | | | ..PLAY NOW.. |
|
|
|
|
nc50lc
Legendary
Offline
Activity: 2520
Merit: 5969
Self-proclaimed Genius
|
![](https://bitcointalk.org/Themes/custom1/images/post/xx.gif) |
April 20, 2022, 10:42:12 AM |
|
Edit: I've no idea what the hell happened to the first image.
The forum has a bug in displaying the first column of the table, the image may look small or if there are rows, tightly compressed. It will show just fine in preview but not in the actual post. The workaround is to add a dummy empty first column [td][/td] in every row, using your example: [center] [table] [td][/td] [td][img]https://i.imgur.com/W9hbTRV.png[/img][/td] [td][img]https://i.imgur.com/W9hbTRV.png[/img][/td] [td][img]https://i.imgur.com/W9hbTRV.png[/img][/td] [/table] [/center] added second row: [center] [table] [tr] [td][/td] [td][img]https://i.imgur.com/W9hbTRV.png[/img][/td] [td][img]https://i.imgur.com/W9hbTRV.png[/img][/td] [td][img]https://i.imgur.com/W9hbTRV.png[/img][/td] [/tr] [tr] [td][/td] [td][img]https://i.imgur.com/W9hbTRV.png[/img][/td] [td][img]https://i.imgur.com/W9hbTRV.png[/img][/td] [td][img]https://i.imgur.com/W9hbTRV.png[/img][/td] [/tr] [/table] [/center] It's cleaner than adding a whole table inside the first column because this wont add a few pixels between the first and second column.
|
|
|
|
Cookdata
|
![](https://bitcointalk.org/Themes/custom1/images/post/xx.gif) |
April 20, 2022, 11:06:26 AM |
|
Png or jpg Any type of image.
Off pointI count the number of replies before yours, it was more than 10 meaningful contributions from other members and this is all you could contribute? OP is asking how to align images Horizontally, not vertical. Beside your image is too large. @Fivestar4everMVP If you are the original designer of those images, it's best you resize them from your Corel draw, photoshop or whatever software you are using instead of using the forum width and height for adjustment. It will make them easier to align with table nc50lc recommended.
|
|
|
|
|