dpi in css einstellen?

[Osterhase]

Hallo!

Ich habe mir ein Template für Vorlagen erstellt um Angebote zu erzeugen aus einer Kundendatenbank heraus.
Diese Template wird in einem Iframe angezeigt.
Ich kann im oberen Teil Input-Felder ausfüllen und unten im Iframe wird immer das Aktuelle Angebot (oder was auch immer für ein Template geladen ist) angezeigt.
Das ganze - und das ist der Knackpunkt - soll am Ende als PDF raus kommen.
DomPdf ist auf 150 DPI eingestellt, weil mir 96 DPI zu schlecht von der Qualität waren.
Die CSS-Eigenschaften für das Template, was im Grunde nur ein Hintergundbild ist (und im Vordergrund eben die Variablen), sind die eines DinA4-Blatts also genau

width: 21.0cm;  
height: 29.7cm;

Das PDF kommt nun Perfekt raus!
ABER die anzeige im Iframe ist ABGEHACKT also ich sehe etwa nur die Hälfte des DinA-Blatts.
Das Hintergrundbild selbst hat folgende Eigenschaften:
1240px * 1754px oder eben 209,97mm * 297,01mm @ 150 DPI.
Das Problem welches ich sehe ist, dass der Browser auf 96 DPI eingestellt ist und daher das Bild abhackt.

Die Lösung ist das Bild via CSS nicht mit cm zu Skalieren sondern mit px also 1240px * 1754px.

Frage: Kann ich es auch so hin bekommen, dass ich die cm Angabe stehen lassen kann und dem Browser irgendwie sage, dass 150 DPI gemeint sind?

[Der Martin]

Hi,

Das ganze - und das ist der Knackpunkt - soll am Ende als PDF raus kommen.
DomPdf ist auf 150 DPI eingestellt, weil mir 96 DPI zu schlecht von der Qualität waren.

soweit in Ordnung. PDF ist natürlich ein Format, was sich am Druckbild orientiert.

Die CSS-Eigenschaften für das Template, was im Grunde nur ein Hintergundbild ist (und im Vordergrund eben die Variablen), sind die eines DinA4-Blatts also genau

width: 21.0cm;

height: 29.7cm;

  
Zusammen mit den oben vorgegebenen 150dpi ergibt sich damit in Pixeln eine Blattgröße von 1240x1754, wie du ja weiter unten auch ausgerechnet hast.  
  

> ABER die anzeige im Iframe ist ABGEHACKT also ich sehe etwa nur die Hälfte des DinA-Blatts.  
  
Kein Wunder - oder hat dein iframe auch eine Breite von 1240px?  
  

> Das Problem welches ich sehe ist, dass der Browser auf 96 DPI eingestellt ist und daher das Bild abhackt.  
  
Der Browser kennt gar keine dpi-Zuordnung. Er bekommt ein Bitmap-Bild, und soll das auf einem pixelbasierten Ausgabemedium anzeigen. In Ermangelung anderer Angaben geht er von einer 1:1-Skalierung aus.  
  

> Die Lösung ist das Bild via CSS nicht mit cm zu Skalieren sondern mit px also 1240px \* 1754px.  
  
Was ändert das? Dann ist es immer noch größer als dein iframe.  
  

> Frage: Kann ich es auch so hin bekommen, dass ich die cm Angabe stehen lassen kann und dem Browser irgendwie sage, dass 150 DPI gemeint sind?  
  
Nein. Du kannst dem Browser höchstens angeben, wie breit/wie hoch er das Bild darstellen soll. In deinem Fall würde sich entweder die iframe-Größe in Pixel anbieten, oder 100%. Wenn das Bild mit CSS als Hintergrundbild eingebunden wird, hast du diese Skalierungsmöglichkeit aber leider nicht.  
Als Notbehelf könntest du statt des Hintergrundbildes ein absolut positioniertes und mit der passenden Größe versehenes img-Element nehmen und das per z-order "hinter" den restlichen Seiteninhalt legen. "Schön" wird es dann vielleicht nicht aussehen, denn die Skalierungsalgorithmen der Browser sind meist nicht besonders toll.  
  
So long,  
 Martin  

-- 
Solange der Nagellack nicht trocken ist,  
ist eine Frau praktisch wehrlos.  
  (Burt Reynolds, US-Schauspieler)