<img> inside <td> in PDF, image won't fit in cell

This forum is for all Flare issues related to PDF, eBook, Microsoft Word, Adobe FrameMaker, XPS, and XHTML book targets.
Post Reply
oceanclub
Sr. Propeller Head
Posts: 277
Joined: Thu Oct 10, 2013 4:45 am
Location: Dublin

<img> inside <td> in PDF, image won't fit in cell

Post by oceanclub »

I have some Flare topics which are converted from Markdown and there are some images which are directly inside a table cell, such as:

Code: Select all

      <td>
          <img src="Images%5Cadv_mode_button.png" alt="adv_mode_button" />
      </td>
However I create PDF output, the image does not fit inside the cell:

Image

In HTML5 output the image is resized to fit the cell correctly.

The CSS style used for both is the same:

Code: Select all

img
{
	border: none;
	max-width: 100%;
	height: auto;
}
I then tried adding the following to my stylesheet:

Code: Select all

td > img
{
	border: none;
	max-width: auto;
	height: auto;
}
However, the image still expands outside the cell.

Any help appreciated,

Paul
robdocsmith
Sr. Propeller Head
Posts: 247
Joined: Thu May 24, 2018 3:11 pm
Location: Queensland, Australia

Re: <img> inside <td> in PDF, image won't fit in cell

Post by robdocsmith »

Hey,

I think this is like the issue of right margin adherance in viewtopic.php?f=10&t=32535...

What happens if you embed the <img> inside a <p> element? For some reason, when sizing images using percentages (particularly max-width), the element can't seem to work out what the width of the container is (and therefore what the relative percentage should be) and it defaults display to the full size of the image.

Try changing to:

Code: Select all

<td>
     <p>
          <img src="Images%5Cadv_mode_button.png" alt="adv_mode_button" />
     </p>
</td>
Rob
Post Reply