Forum:(Solved) Vertical spacing of images

ShoutWiki — express yourself and be heard!
Jump to navigation Jump to search
Forums: Index > Community help

On this wiki page, there's a image gallery shown at listed applications:


The problem is that the thumbnails are spaced by rows, but I would like to see them spaced vertically the same way:


On the page, I'm using the following code to show the pictures:

<div class="thumb tleft"><gallery mode=nolines widths=175 heights=999 perrow=3>

Is there some easy hack to fix this (possibly without using CSS, to keep the code short)? --MYself (talk) 18:43, 25 January 2014 (UTC)

Out of curiosity what does class="thumb tleft" do?
And where is the CSS stored for class="thumb tleft"? I don't see it here:
And what did you do to create that second gallery shown here? The wikicode you presented here is for the first gallery. --Timeshifter (talk) 22:22, 25 January 2014 (UTC)
1. The specified class aligns the image gallery (or anything else you specify, like YouTube videos), allowing text to appear on the side, rather than on top/bottom
2. No idea, I copied it from this page (this is the reason why I would not like to use CSS, since there can be some function already implemented, that will fit for my needs)
3. Edited the first image using GIMP
--MYself (talk) 13:01, 26 January 2014 (UTC)
Thanks. I looked around on Wikipedia and elsewhere and found this info:
Wikipedia:WP:Picture tutorial#Co-aligning
Wikipedia:WP:Picture tutorial#Galleries
Wikipedia:Help:Gallery tag
--Timeshifter (talk) 23:52, 26 January 2014 (UTC)
I tried the suggestions from pages today, but was unable to find anything useful. It probably needs a new template where the images will be sorted using a table. I'm going to abandon this effort for now, and focus on other, more important parts.
For the meantime, if anyone reading this know about a wiki page that has a gallery of images aligned the same way as shown above, please drop a link to this thread. Any working example is appreciated too. --MYself (talk) 18:37, 29 January 2014 (UTC)
I was able to implement the required function by using the following code:
|style="vertical-align:top"|<div style="margin-bottom:4px">[[File:{{{name}}}-1.png|182px]]</div>[[File:{{{name}}}-4.png|182px]]
|style="vertical-align:top"|<div style="margin-bottom:4px">[[File:{{{name}}}-2.png|182px]]</div>[[File:{{{name}}}-5.png|182px]]
|style="vertical-align:top"|<div style="margin-bottom:4px">[[File:{{{name}}}-3.png|182px]]</div>[[File:{{{name}}}-6.png|182px]]
This thread can be now marked as solved. --MYself (talk) 15:46, 4 February 2014 (UTC)