How to position the text next to images properly in PDF?

Question

I'm using PHP, Smarty and TCPDF library to generate the PDF copy of a document. The document contains images of mathematical expressions from WIRIS editor along with the text content.

I'm having a problem positioning the text coming next to the expression image properly.

I tried every thing in CSS float properties, but nothing happened. I'm attaching the screen shot of exactly what I want with this mail.

This is the smarty template code to print the question and its options:

{foreach from=$question_data item=qstn_ans key=key}
    <table border="0" width="100%" cellpadding="2" cellspacing="0">
        <tr>
            <td valign="top" >{if $qstn_ans.question_directions}{$qstn_ans.question_directions}<br /><b>Question {$que_seq_no} : </b>{/if}{$qstn_ans.question_text}</td>
        </tr>
        {if $qstn_ans.question_file}
        <tr>
            <td><img src="{$ques_thum_image_path}{$qstn_ans.question_id}_{$qstn_ans.question_file}" /></td>
        </tr>
        {/if}
        {if $qstn_ans.question_has_sub_ques==0}
            {if $qstn_ans.answer}
                {foreach from=$qstn_ans.answer item=ans key=ans_no}
                    <td valign="top" >
                        {if $ans.answer_is_right==1}{assign var='correct_ans' value=$ans_no+1}{/if}
                            <b>{$ans_no+1}.</b>&nbsp;&nbsp;{if $ans.answer_text!=''}{$ans.answer_text}{/if}
                            {if $ans.answer_file!=''}<img src="{$ans_thumb_img_path}{$ans.answer_id}_{$ans.answer_file}" />{/if}
                     </td>
                </tr>
                {/foreach}
        <tr>
            <td></td>
        </tr>
    </table>
{/foreach}

This code snippet may contain some errors, as I pasted it randomly without checking the loop and brackets completion, but that's not the issue here.

The only important part from this code are the lines to print the question text and question image if it is present.

I researched for the right solution, but couldn't get the desired one. Can anyone help me out.

Screenshot

Answer 1

Find this code working properly

$html = <<<EOD
<h1><img src="http://www.google.com/logos/2013/wangari_maathai_73rd_birthday-1400005-hp.jpg" height="50px" width="150px"> Welcome to <a href="http://www.tcpdf.org" style="text-decoration:none;background-color:#CC0000;color:black;">&nbsp;<span style="color:black;">TC</span><span style="color:white;">PDF</span>&nbsp;</a>!</h1>
<i>This is the first example of TCPDF library.</i>
<p>This text <img src="http://www.google.com/logos/2013/wangari_maathai_73rd_birthday-1400005-hp.jpg" height="50px" width="150px"> <br>is printed using the <i>writeHTMLCell()</i> method but you can also use: <i>Multicell(), writeHTML(), Write(), Cell() and Text()</i>.</p>
<p>Please check the source code documentation and other examples for further information.</p>
<p style="color:#CC0000;">TO IMPROVE AND EXPAND TCPDF I NEED YOUR SUPPORT, PLEASE <a href="http://sourceforge.net/donate/index.php?group_id=128076">MAKE A DONATION!</a></p>
EOD;

// Print text using writeHTMLCell()
$pdf->writeHTMLCell($w=0, $h=0, $x='', $y='', $html, $border=0, $ln=1, $fill=0, $reseth=true, $align='', $autopadding=true);

Answer 2

It seems like all that information that is out of alignment is coming from $qstn_ans.question_text, so there isn't really a problem with the code above.

I would suggest saving each "statement" in that question's text in a separate paragraph. E.g.

<p>Statement I: The variance of first n even natural numbers is <img src="?" /></p>
<p>Statement II: The sum of first n natural numbers is <img src="?" /></p>
<p>and the sum of squares of first n natural numbers is <img src="?" /></p>

This should cause each "line" of the question text to display separately without bumping into each other.