I'm trying to align images to the bottom of a td element to achieve something like this (the three images, independently from the height of the other images, will be always on the bottom of the td):
Expectative:
With the following markup:
<?php
// create some HTML content
$html = '<h1>Image alignments on HTML table</h1>
<table cellpadding="0" cellspacing="0" border="1" style="text-align:center;">
<tr>
<td width="33%">
<img src="signature1.png" border="0" align="bottom"/>
</td>
<td width="33%">
<img src="signature2.png" border="1" align="bottom" style="margin-bottom: 0px;" />
</td>
<td width="33%" align="bottom">
<img src="signature3.png" border="0" align="bottom" style="padding: 5px;" />
</td>
</tr>
</table>';
// output the HTML content
$pdf->writeHTML($html, true, false, true, false, '');
//Close and output PDF document
$pdf->Output('example_006.pdf', 'I');
However TCPDF doesn't support padding nor margin rules and i'm getting the following result:
Reality:
In the official documentation there's the align bottom property but it doesn't work.
Note: it's worth to say that the images don't have transparent pixels
around them (on top or bottom where it matters ... ) e.g:
Thanks in advance !
Pitifully TCPDF ended up without support for padding or margin, which means that what i needed wasn't technically possible. I decided to move to Dompdf that allows this behaviour using CSS rules (specifically vertical align, mentioned in this article).
Related
I have a problem - I am trying to include a background image using CSS for the layer, but it doesn't work...
The CSS file looks like this
header {
background-image: url("boisko.jpg");
background-repeat: no-repeat;
background-size: 100%;
background-position: center;
}
The main file looks like this
<?php
error_reporting(0);
echo "<style>";
include "styl.css";
echo "</style>";
echo "<table cellpadding=\"0\" cellspacing=\"0\" width=\"100%\">
<tr>
<td width=\"100%\" colspan=\"2\">";
include_once"Naglowek/index.php";
echo"<td>
</tr>
<td width=\"100%\" colspan=\"2\">";
include_once"Jezyk/index.php";
echo"</td>
</tr>
</table>";
?>
The background image should show in the cell where "Naglowek.index.php" is included, but it doesn't... That file looks like this:
<?php echo "<head><br><h1>Cracow Sunday Football League</h1><br><br></head>";?>
I know I could have written that file in html, but I would prefer it staying in php if it doesn't really matter.
Why doesn't my background image show up?
You have header in the CSS, but head in the HTML
Well you kind of have the right idea. You can save your file as a .php and still write the HTML that is needed.
Change the pages to look like this.
Main Page:
`<?php
<html>
<head>
<!-- title for the document, scripts, styles, meta information,and more -->
</head>
<body>
<table cellpadding="0" cellspacing="0" width="100%">
<tr>
<td width="100%" colspan="2">
<?php include_once"Naglowek/index.php"?>
<td>
</tr>
<td width="100%" colspan="2">
<?php include_once"Jezyk/index.php"; ?>
</td>
</tr>
</table>
?>`
As for the CSS I don't see anything class or ID called header so nothing is going to be applied.
<div class="header"></div>
As for the "Naglowek.index.php" file, it can stay the same as it being a .php file you just don't need the tags. Just straight HTML will work.
`<head><br><h1>Cracow Sunday Football League</h1><br><br></head>`
You should get rid of the head tags because they are a container for all the head elements.
I hope this helps clear things up
mPDF: Hide table row (CSS display:none) not work.
Do you have any suggest?
My code:
<table align="center">
<tr style="display:none">
<td valign="top" align="left">InfoOption1:</td>
<td valign="top" align="left" colspan="2">#InfoOption1</td>
</tr>
</table>
I feel very dirty for posting this suggestion, but it's the best I got working:
<tr><td>...</td></tr>
<div style="display: none;">
<tr><td>...</td></tr>
</div>
The DIV is the working part. Luckily, html validnes for seo isnt relevant for mPDF
It works if you enclose the row you want to hide inside a Div. The div will have a class which have declared hidden property.
<div class='hide_this_row'>
<tr>
<td>...</td>
</tr>
</div>
<!-- CSS file will look like this -->
<style>
.hide_this_row{
display :none;
}
</style>
Hi I am using mpdf for generating pdfs. Now I am facing problem with table border in html. I have following style for table in html
<table border="10" cellpadding="1" cellspacing="1" style="width: 500px;">
<tbody>
<tr>
<td>Test header</td>
<td>Test header</td>
</tr>
<tr>
<td>body</td>
<td>body</td>
</tr>
<tr>
<td>body</td>
<td>body</td>
</tr>
</tbody>
So the resulted pdf is not respecting the border size of the table. I attached the pdf. Please checj
remove border="10" and use border:10px solid at style attribute for inline at <table> tag, <tr> and at <td> tags also as mpdf will work on inline style sheet for all browsers.
You can try inline css ..
like
<table style="border:1px solid black;">
I had the same problem until i realised i had $mpdf->simpleTables = true;, borders showed up as soon as i set $mpdf->simpleTables = false;
I had to do the trick:
For A4 pages, I've created a 794x1122px image (example) , and set that image as a body background :
<?php
include_once(dirname(__file__).'/mpdf.php');
$mpdf=new mPDF( '', // mode (default '')
'A4', 0, '', // format ('A4', '' or...), font size(default 0), font family
15, 15, 16, 16, 9, 9, //(margins) left, right, top, bottom, HEADER, FOOTER
'L');
$texttt= '<html><head><style>
body {
background:url("./background1.png") ;
line-height:1.3em;
background-color: #F2F0EE;
}
</style></head><body>
My Textttttt
</body></html>';
$mpdf->WriteHTML($texttt);
$mpdf->Output('my_pdf_FILEEEEEE','F');
?>
heyy.. I am new to php.. I am trying to convert a page containing nested tables into pdf.. this is the page i need to convert
<!DOCTYPE html>
<html>
<body>
<div style="margin-left: auto; margin-right: auto; width: 75%">
<table width="1000" border="1" bordercolor="#500000">
<tr>
<td colspan="2" style="background-color:#500000;">
<h1 style="text-align:center;"><font color="#FFFFFF">COMPANY NAME</font></h1>
<h2 style="text-align:center;"><font color="#FFFFFF">BALANCE SHEET</font></h2>
<h3 style="text-align:center;"><font color="#FFFFFF">DATE</font></h3>
</td>
</tr>
<tr>
<th width="50%">ASSETS</th>
<th width="50%">LIABILITIES</th>
</tr>
</tr>
<tr>
<!-- <td width="480"><?php include('assets.php') ?></td>
<td width="480">fadffd</td> -->
<td><iframe src="assets.php" frameborder="0" width="500" height="500"></iframe></td>
<td><iframe src="liabilities.php" frameborder="0" width="500" height="500"></iframe></td></tr>
<tr>
<td colspan="2" style="background-color:#500000;text-align:center;"><font color="#FFFFFF">lkfjsdgjljsglhlhfsaj</font></td>
</tr>
</table>
</div>
</body>
</html>
here i have included two tables as table data using iframe.. when i try to import it to pdf using the code shown below, the nested tables are not displayed.
<?php
include("MPDF53/MPDF53/mpdf.php");
$mpdf=new mPDF('win-1252','A4','','',15,10,16,10,10,10);//A4 page in portrait for landscape add -L.
$mpdf->SetHeader('|Your Header here|');
$mpdf->setFooter('{PAGENO}');// Giving page number to your footer.
$mpdf->useOnlyCoreFonts = true; // false is default
$mpdf->SetDisplayMode('fullpage');
// Buffer the following html with PHP so we can store it to a variable later
ob_start();
?>
<?php include "balancesheet.php";
//This is your php page ?>
<?php
$html = ob_get_contents();
ob_end_clean();
// send the captured HTML from the output buffer to the mPDF class for processing
$mpdf->WriteHTML($html);
//$mpdf->SetProtection(array(), 'user', 'password'); uncomment to protect your pdf page with password.
$mpdf->Output();
exit;
?>
please help..
Are you sure that you want to use mpdf? There are several other options. For example, dompdf explicitly supports complex tables. And you can see some other options in this answer
I use tcpdf to generate pdf files.
And there's a problem in aligning image in table td.
I am uising $pdf->writeHTML($html, true, false, true, false, ''); in tcpdf.
html is clear from the image i have shared.
html is just simple as
<table>
<tr>
<td> </td>
<td>Picture</td>
.......
</tr>
<tr>
<td>1</td>
<td style="text-align:center"><img src="abc.jpg" width="20" height="20" ></td>
.......
</tr>
</table>
Note: align="center", valign="middle" , css margin and padding ... nothing seems to work I tried on
text-align:center push into center but not vertically.
Adding the following CSS to your td should work:
td {
vertical-align: middle;
text-align:center;
}
See a fiddle of it working.
Did you check image alignment?
<img align=center src="abc.jpg" width="20" height="20" >
This will work. As shown below, we can add a line break inside the <p> tag.
<table width="100%" style="border:1px solid #000;">
<tr>
<td style="text-align: center;">
<p><br/>
<img src="path/to/image" />
</p>
</td>
</tr>
</table>
you can use :
CSS:
td img{
margin:0 auto;
}
or use like #gayan