Forum How do I...?

css is not getting applied correctly to the converted pdf

satyavati
Hi Mikeday,


Some css are not getting applied to the converted pdf.
Therefore, the html and pdf are not identical.


Could you please help me how to apply
I have imported the style.css in print.css
Please find the html and pdf attached.
  1. iocs.css0.2 kB
  2. page.css0.0 kB
  3. print.css8.5 kB
  4. sample.html35.4 kB
  5. sample.pdf99.7 kB
  6. style.css18.9 kB
mikeday
Can you be more specific? Which styles in particular are not applying?
satyavati
There is a css supplier-box-right cright2 , this getting applied wrongly
please image 'page1.PNG' attached.

Also the width of page is changed because of which the text is wrapped to single line.
please find the image 'page2.PNG'
I wanted the "want to be legally bound by its terms." to be in the new line as it is in html, but it is coming in single line.

  1. page1.PNG8.2 kB
  2. page2.PNG5.7 kB
mikeday
Please note that the style sheets that have media="screen" will not be applied by Prince unless you explicitly specify --media=screen on the command-line; by default only the print media style sheet will be applied, or style sheets marked as media="all".
satyavati
Hi mikeday,

In one of my query you answered that if we import the css files then it gets applied.
I have imported print.css and iocs.css in style.css
I have verified that style.css is getting applied.

Only ".cleft" of "Address" block is not appearing same as html, it seems it is not setting its height to 36px;
as shown in page1.PNG attachment
mikeday
Some of the @media rules in style.css are causing Prince to fail to parse the entire file. Are you seeing this error:
style.css: warning: failed to parse all CSS rules

Moving the @media rules to the very bottom of the file after all the other rules will help.
mikeday
Sorry, I got that wrong: actually Prince is skipping the media rules without any problems, but there are too many close brace } characters at the end, and that is interfering with the following CSS rules.