Last modified: 2011-03-13 18:04:44 UTC
A section of the images tutorial (see link in attached URL) that provides for alignment of images using the "CSS method" stopped working recently. Previously, the images arranged using this method lined up in a horizontal row and wrapped on the page. Now, they are arranged in a single vertical column.
This is an effect of r17986: (bug 6016) Left-aligned images should stack vertically, like right-aligned images, not horizontally.
Aha. I have a feeling that 6016 was misreported as a bug when it was, in fact, a feature, and its expression was critical to that functionality of image display in Wikipedia.
Definitely not a feature. If you want to stack images horizontally, you shouldn't float them... ?
Well, let's see. First of all, this is a question of what the default |left| should do. Either way, you can add manual HTML to permit either way of stacking: to get them to align vertically, add <div style="clear: left;"></div> in between in each image, and to get them to align horizontally, wrap each image in <div style="float: left;">...</div>. (They have to be floated left, Brion, because they're all wrapped in divs. Is there some other way to get divs to stack horizontally?) The question is, which behavior should be default, and why? Now, let's look at the issue reported here. Quite simply, we have a tag for this: <gallery>. The CSS method appears to be obsolete as far as I can see. <gallery> has the added benefit of adding semantic markup, so galleries can be styled separately from random left-floated images. It's also more concise and readable. On the other hand, right-floated images do certainly stack vertically. There's much to be said for consistency, and the resulting confusion of someone was probably why bug 6016 was filed in the first place. I would certainly expect default behavior for right and left floats to be identical. So: what, other than slight and temporary ugliness on a few old pages that were never migrated to <gallery> (Wikipedia isn't famed for its brilliant page design in any case), is to be gained by going back to the old behavior? Are there any other reasons why you'd want to stack images horizontally than to make a gallery? Is the <gallery> tag deficient somehow?
A vociferous yes to the last question; the gallery tag is deficient in numerous important ways, and many pages specifically opt for thumbnails instead of galleries for aesthetic control reasons. Compare, for example, [http://en.wikipedia.org/w/index.php?title=Jeopardy%21_set_evolution&oldid=92628658 here] and [http://en.wikipedia.org/w/index.php?title=Jeopardy%21_set_evolution&oldid=92642725 here]. The first version was an attempt by a user to switch the image display to galleries after r17986 damaged the CSS behavior. The second version has restored the original display method using the HTML hack you have kindly provided. In the gallery version, the thumbnails are too small to make out detail without enlarging the pictures, whereas in the CSS version you don't need to enlarge any of the pictures to see detail. Gallery provides to option for adjusting the size of thumbnails. Second, the pictures are designed to align in a horiztonal row on a 1600 × 1200 monitor display resolution, and align on two rows (i.e., form a 2 × 2 grid) at 1024 × 768. Galleries have no provision for wrapping images to a browser window. I have a feeling that the CSS "fixed" in r17968 was designed to be--no pun in intended--asymmetrical between the left and right especially for the purpose of the CSS method described in this [http://en.wikipedia.org/w/index.php?title=Wikipedia:Picture_tutorial&oldid=92408551#Wiki_markup_and_CSS section] (which has since been removed, but perhaps it would be better, if my cries for a reversion of r17968 go unheeded, to rewrite the section to mention the HTML hack option?). PS to Brion above: You and I know each other. I was the corpse in "Dr. Sexyknickers". Fancy meeting you here!
That should read, "Gallery provides NO option for adjusting the size of the thumbnails"...
I'm pretty sure the old behavior is not intentional; floats in general are really fragile and icky, so unexpected side-effects are... frequent. Probably the sensible thing would be to go ahead and improve gallery... - add some size override options for the thumbs it uses - add dynamic resizability (column wrap-around etc) [Side note on resolutions: pretty much nothing looks good in a browser at 1600 pixels; I usually size my browsers to fit two windows side-by-side on a monitor this size. Of course then you run into the problem that everyone designs their sites for 1024-pixel-wide screens and you have sidebars spilling off the edge...] PS to Robert: Oh *man* that was bad. ;) I've still got it lying around; if you like I can burn you a DVD. Drop me a line off-list.
*gives Brion a very funny look*
For nl.wikipedia I have made a new class, placed in MediaWiki:Common.css. div.afbnaastelkaar div.floatleft, div.afbnaastelkaar table.floatleft, div.afbnaastelkaar div.tleft { clear:none; } When wrapping left-aligned images in a div with this class, the images are placed next to each other, like the behaviour before the bug fix. (afbnaastelkaar = images next to each other)
The problem is that there are about as much pages that break from the "bug" (because people wants it to work so) as there are that breaks from the "feature" (because they expected to work it the same way as the right floats.) Maybe JePe's solution is best.
It seems to me it should be reverted until there are appropriate features in the gallery.
There has been no convincing reason given to do this other than backward compatibility, and presumably that's no longer much of an issue after eleven months. Closing WONTFIX.