Xilize example

tables:float

With tables, the < and > (angle brackets) have two different meanings depending on padding modifiers being present. If there are no padding modifiers, these symbols float the table either left or right; otherwise they align text in the table left and right.

Note: there may have been a bug in Firefox when this example was created – thus the addition of the margin CSS string for correct display in that browser. In any case, Xilize generates the markup correctly.

Xilize markup

browser rendering

Table floating right:

table>({margin:0 0 0 1em}. _| last | first
| Gandhi | Mohandas
| Mandela | Nelson

p<>. This text flows around the floating table. !<) colors.png! Notice that an explicit table signature is used to apply modifiers to the table as a whole - and for tables padding must be included to make the float happen. (The image is included to show a mix of floating elements.

Table floating right:

last	first
Gandhi	Mohandas
Mandela	Nelson

This text flows around the floating table. Notice that an explicit table signature is used to apply modifiers to the table as a whole – and for tables padding must be included to make the float happen. (The image is included to show a mix of floating elements.

XHTML generated

<p>Table floating right:</p>

<table style="margin:0 0 0 1em;float:right;padding-left:1em;">
<thead>
  <tr>
    <td>last</td>
    <td>first</td>
  </tr>
</thead>
<tbody>
  <tr>
    <td>Gandhi</td>
    <td>Mohandas</td>
  </tr>
  <tr>
    <td>Mandela</td>
    <td>Nelson</td>
  </tr>
</tbody>
</table>

<p style="text-align:justify;">This text flows around the floating table. 
 <img src="colors.png" style="float:left;padding-right:1em;" /> Notice that
 an explicit table signature is used to apply modifiers to the table as a whole &#8211;
 and for tables padding must be included to make the float happen. (The image is
 included to show a mix of floating elements.</p>