How can I lay images out in a grid using XSL-FO?

Question

I'm trying to produce sheets of photographs with captions arranged in a grid using XSLT and XSL-FO. The photo URLs and captions are produced using a FOR XML query against an SQL Server database, and the number of photos returned varies from sheet to sheet. I want to lay the photos out in four columns, filling the grid from left to right and from top to bottom. In HTML I'd do this by putting each photo and caption into a div and using "float: left" to make them flow into the grid. Is there a similarly elegant method using XSL-FO?

Answer 1

To keep life simple I would normally setup a table for this, it's quite simple and will ensure that things get laid out right. If you wanted to do it similarly to how you would do it in HTML then you should layout block-container elements.

However you decide to do it I would always recommend using the ZVON Reference site. Nice lookup of elements and available attributes, and while their XSL-FO doesn't include much in the way of explanation every page deep links to the standards document.

Answer 2

In the end I used a table with one row and four cells for this. In each one I selected the source elements with position() mod 4 equal to 0, 1, 2 or 3 as appropriate, and then made sure that the photo and caption was always the same height so the rows lined up correctly.