uncorrect size for image

#26322

When i try to generate the html page, the picture of orange bars have not the correct size.
Example with the files attached .
ihm example is the html
html2pdf is the pdf generated from the html .

the css used is :

.formCtactTitre1, .formCtactTitre1Off {
width:731px; height:32px;
padding:7px 5px 0 30px;
font-size:12px; font-weight:bold; color:#FFF;
}
.formCtactTitre1 {
background:url(../images/form_ctact_titre1.jpg) no-repeat center;
margin:5px 0 2px 0
}
.formCtactTitre1Off {
background:url(../images/form_ctact_titre1_off.jpg) no-repeat center;
margin:2px 0 2px 0
}

if i add the height of img directly in the css it works :

.formCtactTitre1, .formCtactTitre1Off {
width:731px; height:32px;
padding:7px 5px 0 30px;
font-size:12px; font-weight:bold; color:#FFF;
}
.formCtactTitre1 {
background:url(images/form_ctact_titre1.jpg) no-repeat center;height:40px;
margin:5px 0 2px 0
}
.formCtactTitre1Off {
background:url(images/form_ctact_titre1_off.jpg) no-repeat center;
margin:2px 0 2px 0
}

#27811

HTML source of the document would help a lot to analyze the problem reason. Could you please send it to support or attach to the thread? Thanks.

#27812

I have the same issue!

It’s like if I use zoom property in the css… but I didn’t use it.

How to fix?

Thanks

Mk

#27813

I have the same problem here…In HTML the imagem is shown in normal size. When it is rendered with PD4ML, the image is zoomed.

How can we fix that?

#27814

And again: the document HTML source and resulting PDF would help to answer your question.

#27815

How do I attach files to the message?

#27816

pack them to a zip.

below the message text field, there is “choose file” and “add the file” buttons to add a message attachment.

#27817

I think this is an issue of DPI. PD4ML seems to increase the image size by about 20%.

What DPI does PD4ML render at?

If I know that, I can potentially specify a smaller-than-normal height and width for the images in my image tags, so they render properly.

To test this, try rendering any image and you will notice it’s larger on the PDF than on the web page, causing it to be pixelated.
Like so:

(Haven’t tried it without the width/height specified – could that be the cause?)

#27818

I believe I am having a similar problem. All of my images are pixelated. Did you/anyone find a fix for this?

Thanks in advance for any help with this.

#27819

PD4ML never applies any kind of resampling to images. It embeds them to PDF, keeping original pixels untouched.

Here is some info an a possible workaround:
pdf-generation-troubleshooting-f4/prevent-images-being-scaled-t38.html

#27820

I send you all the sources in order to analyse the bug i’ve post 28 Jan 2010, 13:28 .
by the way, the version of pd4ml i use is : pd4ml.src.360fx1

#27821

any respone ?

#27822

The archive does not contain images 🙁
Please add

#27823

i’ve added picture of original html

#27824

I expected you send us at least form_ctact_titre1.jpg. Your HTML/CSS implicitly assumes dimensions of the image, which are not known to me.

@jj_ben wrote:

When i try to generate the html page, the picture of orange bars have not the correct size.

if i add the height of img directly in the css it works :

[language=css:3ke6x301].formCtactTitre1, .formCtactTitre1Off {
width:731px; height:32px;
padding:7px 5px 0 30px;
font-size:12px; font-weight:bold; color:#FFF;
}
.formCtactTitre1 {
background:url(images/form_ctact_titre1.jpg) no-repeat center;height:40px;
margin:5px 0 2px 0
}[/language:3ke6x301]

With height:40px; you do not scale the image, but increase the DIV height (overriding previous height:32px setting). Obviously form_ctact_titre1.jpg height is about 40px (greater than the initial 32px).

I tried to reproduce the situation, when background image height is less than the box. See attached – PD4ML does not center the background vertically. It is a good question why MS IE does. CSS requires a vertical positioning hint given explicitly:

background:url(images/form_ctact_titre1.jpg) no-repeat center center;

With the CSS change PD4ML positions the background image correctly.

[Author]

Posts