When we define a table in Asciidoctor we might want to span a cell over multiple columns or rows, instead of just a single column or row. We can do this using a cell specifier with the following format: column-span.row-span+. The values for column-span and row-span define the number of columns and rows the cell must span. We put the cell specifier before the pipe symbol (|) in our table definition.
In the following example Asciidoctor markup we have three tables. In the first table we span a cell over 2 columns, the second table spans a cell over 2 rows and in the final table we span a cell over both 2 columns and rows.
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 | == Table cell span.Cell spans columns|===| Name | Description| Asciidoctor| Awesome way to write documentation// This cell spans 2 columns, indicated// by the number before the + sign.// The + sign // tells Asciidoctor to span this// cell over multiple columns.2+| The statements above say it all|=== .Cell spans rows|===| Name | Description// This cell spans 2 rows,// because the number after // the dot (.) specifies the number// of rows to span. The + sign // tells Asciidoctor to span this// cell over multiple rows..2+| Asciidoctor| Awesome way to write documentation| Works on the JVM|=== .Cell spans both rows and columns|===| Col1 | Col2 | Col 3// We can combine the numbers for// row and column span within one// cell specifier. // The number before the dot (.)// is the number of columns to span,// the number after the dot (.)// is the number of rows to span. 2.2+| Cell spans 2 cols, 2 rows| Row 1, Col 3| Row 2, Col 3|=== |
If we transform our source to HTML we get the following tables:
Written with Asciidoctor 1.5.1.
