Arkusz stylów drukowania - szerokość strony drukowanej Inny w pakiecie Webkit vs. Gecko/IE

Question

Podczas drukowania poniższej strony w Safari/Chrome zawartość (w zasadzie wszystko na stronie) jest zgnieciona po lewej stronie, około 60 % szerokości strony.

Jednak w FireFox i IE 7 wydrukowana strona pokazuje zawartość jako pełną szerokość (i wygląda całkiem nieźle, imo). Zmieniłem rozmiar wszystkich elementów układu na 100% szerokości (używając !, aby upewnić się, że się stosują), a Safari/Chrome nadal nie wydrukują całej szerokości.

Oto strona mam przedstawieniu: http://archstl.org/commoffice/press-release/2010/local-catholic-principal-honored-fi

A oto obraz różnicy między Webkit (pierwszy) vs. Gecko (sekundy): Webkit's Print Rendering http://img.skitch.com/20100518-cgr6t6edwyr3x7p55f5eewqy6r.jpg Gecko's Print Rendering http://img.skitch.com/20100518-bxgxnyd3uecu5cp2ba2whnp3uy.jpg

Answer 1

Postanowiłem zrezygnować z prób ulepszania arkuszy stylów drukowania, a zamiast tego akceptować tylko dziwne problemy z odstępami w różnych przeglądarkach.

Polecam wszystkim osobom, które próbują nadrukować twoje strony do druku, ale rozważam używanie @screen zamiast @all do głównych arkuszy stylów witryny - to sprawia, że ​​stylizowanie rzeczy do druku jest łatwiejsze w bardziej złożonych układach.

Anyways, powinniśmy po prostu przenieść do 21 wieku i zapomnieć o drukowaniu ;-)

Answer 2

przepraszam naprawdę nie odpowiedź ale komentarz (nie mogę jeszcze komentować), ale czy próbowałeś już wydrukować arkusz? jeśli nie, po prostu spróbuj.

Sprawdziłem również twoje print.css i chociaż nie jestem tego pewien, może możesz sprawdzić rozmiary czcionek. Spróbuj najpierw użyć pikseli zamiast em. Ponieważ em jest względny w stosunku do podstawowego rozmiaru czcionki, może się różnić w przeglądarkach. Możesz to poprawić, dodając stały rozmiar czcionki w stylu twojego ciała:

body { font-size: 13px; } 

następnie kontynuuj używanie em dla pozostałych.