Bottom of image cut off in PDF

[Pamb10]

I have some images in my project that, when generated to PDF, the bottom is cut off. I cannot see why this is happening.

Here is what it looks like in the editor:

image bottom cut.jpg

This is what it looks like in the PDF:

images cut pdf.jpg

Any ideas would be appreciated.

[ChoccieMuffin]

Does the bottom border come back if you change the magnification of the PDF? I've found that if I have a very thin line around screenshots the line disappears if the magnification is small but when I zoom in or print it appears as expected.

[Pamb10]

No it does not appear if i increase magnification.

[ChoccieMuffin]

What class of <p> is your screenshot sitting in? You might find that if you create a p.screenshot and then in your stylesheet in the print medium add a bit more space top and bottom (I can never remember whether that's best done as margin or padding!) that the bottom of your image comes back.

[Pamb10]

I'll take one image as an example, Forgot Username (as shown)

<p>
<img src="../Resources/Images/Forgot Username.png" style="width: 203px;height: 113px;padding-top: 10px;padding-bottom: 12px;" />
</p>

CSS:

p
{
margin-bottom: 12pt;
margin-top: 8pt;
font-size: 10pt;
font-family: Arial;
}


The actual image size is 473x265.

I have tried removed the padding as well. I added the padding to give some spacing before and after the image.

[Robotman]

Just as a test, what happens if you remove the width: 203px;height: 113px; from the image? Does the full image with bottom border display?

[Pamb10]

Getting closer...

I reset the image size. In the new pdf at 75% I did not see the bottom, but zoomed to 100% and see it.

That is great! However, Im not really sure what that means...lol

[ChoccieMuffin]

In this bit:

"<p>
<img src="../Resources/Images/Forgot Username.png" style="width: 203px;height: 113px;padding-top: 10px;padding-bottom: 12px;" />
</p>"

everything in red is inline formatting, which is best avoided. What if you take ALL of that out and set a max-width OR max-height (not both) on your img tag in your stylesheet?