user198003
user198003

Reputation: 11151

How to center html table?

Trying to create proper PDF document, using PHP and TCPDF.

Can you help me, how can I use writeHTML function to create and center table, in TCPDF?

Tryed with:

 $html = '

 <div style="margin-left: auto; margin-right: auto; width: 50%">
  <table border="1" width="200" align="center"><tr><td><b>Invoice number: '.$this->xInvoiceNumber.'</b></td></tr></table>
  <br />
  <table border="1" width="200" align="center"><tr><td>'.$this->xClient.'</td></tr></table>
  <br />
 </div>

... but no luck.

Upvotes: 3

Views: 39810

Answers (5)

user4455060
user4455060

Reputation: 31

Try this code; it worked for me:

<table style="width:100%">
  <tr>
    <td style="width:30%">left margin</td>
    <td style="width:40%">
      <table border="1" style="width:100%">
        <thead>
          <tr>
            <td style="width:100%" colspan="2"></td>
          </tr>
          <tr>
            <td style="width:40%"><b></b></td>
            <td style="width:60%"><b></b></td>
          </tr>
        </thead>
      </table>
    </td>
    <td style="width:30%">rigth margin</td>
  </tr>
</table>

Upvotes: 2

RAfAR
RAfAR

Reputation: 171

You have to make a table with 3 columns, set the width for every one of them and in the middle one you have to create your table.

<table>
<tr>
<td style="width:25%"></td>
<td style="width:50%"><table><tr><td>Your content</td></tr></table></td>
<td style="width:25%"></td>
</tr>
</table>

I'm not proud of this method but it's working :)

Upvotes: 17

user198003
user198003

Reputation: 11151

Ok, so I don't know if there is solution for my problem...

However, I did manage to solve it by using writeHTMLCell funcion, ie.

$this->writeHTMLCell(50, 0, 50, 50, 'cellcontent', 'LRTB', 1, 0, true, 'L'); 

If somebody can find better solution, please reply.

Tnx!

Upvotes: 3

user238638
user238638

Reputation:

Never done anything like this however, this is the code you would need to center a table that is the cross browser compatible

<div style="text:align:center;">
  <table style="margin:0px auto" border="1" width="200" align="center">
    <tr>
      <td><b>Invoice number: </b></td>
    </tr>
  </table>
  <br />
  <table style="margin:0px auto"border="1" width="200" align="center">
    <tr>
      <td>Client</td>
    </tr>
  </table>
  <br />
</div>

If pdfs support css i would advise styling the html elements using css

table{
  border:1px solid black;
  margin:0px auto;
  text-align:center;
  width:200px;
}

Hope this helps!

Upvotes: 0

Dustin Carpenter
Dustin Carpenter

Reputation: 313

Try replacing your opening div tag with this...

<div style="margin:5px auto; width:50%">

Upvotes: 0

Related Questions