Convert WPF FlowDocument Table to HTML table

Question

I'm having difficulty understanding how to get a WPF Table to expand to the size of the parent FlowDocument's PageHeight. Here is how I think its done in CSS & HTML.

CSS (styles.css):

#content{
    width:10.5in;
    height:72in;
    border:2px solid black;
    position: relative;
}
#details {
    position:absolute;
    bottom:0;
    width:100%;
    border:1px solid navy;
    border-collapse:collapse;
}
td,th {
    border:1px solid navy;
}

And HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
        <link href="styles.css" rel="Stylesheet" type="text/css" />
    </head>
    <body>
        <div id="content">
            <table id="details">
                <tr>
                <th>id</th><th>name</th><th>description</th>
                </tr>
                <tr><td>1</td><td>tool</td><td>long tool</td></tr>
                <tr><td>2</td><td>tool</td><td>short tool</td></tr>
                <tr><td>3</td><td>tool</td><td>temporary tool</td></tr>
            </table>
        </div>
    </body>
</html>

Now could someone help me come up with some XAML that will look the same when rendered. I was hoping to use the WPF FlowDocument and Table so I could use a XLST to translate the XAML to an HTML page at runtime. Right now the WPF table doesn't expand to fill the page.

score 0 · Answer 1 · answered Jul 09 '13 at 18:57

This should work for you:

<FlowDocument>
  <Table Width="Auto" Height="Auto">
    <Table.Columns>
      <TableColumn />
      <TableColumn />
      <TableColumn />
    </Table.Columns>
    <TableRowGroup>
      <TableRow>
        <TableCell>
          <Paragraph>Cell at Row 1 Column 1</Paragraph>
        </TableCell>
        <TableCell>
          <Paragraph>Cell at Row 1 Column 2</Paragraph>
        </TableCell>
        <TableCell>
          <Paragraph>Cell at Row 1 Column 3</Paragraph>
        </TableCell>
      </TableRow>
    </TableRowGroup>
  </Table>
</FlowDocument>

Convert WPF FlowDocument Table to HTML table

1 Answers1