Forum:Gallery template

Hi, I'd like to hear some suggestion about which is the best way to make a "gallery template". I'm currently using templates like this one, basically simply a table, but I want to make a generic template which I'll use to make these kind of galleries. My idea was to use a pair of template that in the end have a structure like this one:

Each cell is composed by an image and a caption, so I tried making the elements nested tables of the mother table with these templates (1 and 2, which give this result, the standard way is shown above it). My problem is that I want the nested tables/elements to be displayed inline so that an element will be shown in a new row when there is no more space left, now I'm forcing the rows every 5 elements, I want it automatic because, for example, in monobook the table can be wider. I tried to make divs instead nested tables, but it either show all elements in a single row or make a new row for each of them. Any ideas?


 * The trick is to use the css styling  on your divs to make them behave like a cross between inline elements and block elements. That's what Wikia does for their galleries. Check out this W3Schools page for more information about the display property: http://www.w3schools.com/cssref/pr_class_display.asp
 * Look at the html code in the page source below to see an example of Wikia's gallery code.

      


 * For some reason Wikia sticks their divs inside of span tags that have been styled with  I'm not sure why. Technically, placing a block level element (such as a div) inside of an inline element (such as a span) is invalid html.
 * I've never made an image gallery template like yours, but I have made a video gallery template that might be a helpful example. My video gallery template has a fixed width, so it can't wrap onto multiple lines like you want. However, it does have the basic idea of individual items or captions being hidden automatically if they are left empty, so you could have a variable number of images with or without captions in your gallery. If you combine that idea with Wikia's html gallery code, you would have what you want. --Gardimuer { ʈalk } 18:16, April 12, 2012 (UTC)


 * I have already tried the propriety, but I tried it in a wiki table which results in an image per row (don't know why), now I'll try doing all that in HTML, hope it will works.