search

dmk99 / react-pdf-table

Storybook Available
https://dmk99.github.io/react-pdf-table
MIT License
152 stars 62 forks source link

Absolute positioning makes the table styles go away #28

Open kishaningithub opened 3 years ago

kishaningithub commented 3 years ago

I have to position the table in a given position in the PDF. When i do absolute positioning, the table style including table borders completely disappears.

<PDFViewer>
    <Document>
        <Page>
            <View style={{ position: "absolute", left: 0, top: 0 }}>        
                <Table
                    data={[
                        {firstName: "John", lastName: "Smith", dob: new Date(2000, 1, 1), country: "Australia", phoneNumber: "xxx-0000-0000"}
                    ]}
                >
                    <TableHeader>
                        <TableCell>
                            First Name
                        </TableCell>
                        <TableCell>
                            Last Name
                        </TableCell>
                        <TableCell>
                            DOB
                        </TableCell>
                        <TableCell>
                            Country
                        </TableCell>
                        <TableCell>
                            Phone Number
                        </TableCell>
                    </TableHeader>
                    <TableBody>
                        <DataTableCell getContent={(r) => r.firstName}/>
                        <DataTableCell getContent={(r) => r.lastName}/>
                        <DataTableCell getContent={(r) => r.dob.toLocaleString()}/>
                        <DataTableCell getContent={(r) => r.country}/>
                        <DataTableCell getContent={(r) => r.phoneNumber}/>
                    </TableBody>
                </Table>
            </View>
        </Page>
    </Document>
</PDFViewer>