display:table-cellのずれ

質問

CSSを使ってWebのレイアウトを組んでいるのですが、
印刷プレビュー対応のために、floatを使っている部分を、
印刷時のみ　display:table;　を使って、テーブルレイアウトに
変更するための記述を、現在行っています。

うまい具合に、印刷プレビューで左右にレイアウトが分かれ、
2P以降もきれいに表示さているのですが、ふとよく見てみますと、
右側に配置したDIVが、ほんの3pxほど左にずれていることに気づきました。

floatを使って、左右に分かれたレイアウトのWebサイトを作成しています。
表示上はうまくできていて、次は印刷プレビューに挑戦と思い、
下記のサイトなどを参考に、テーブルレイアウトに変更する方向で
現在作成を行っています。

http://www.materialpot.com/css/ie7firefoxcss.php

一時は、プレビューもうまく表示できたと思っていたのですが、
なぜか、float:rightしている側のDIVが、左に3pxほど寄って、
ずれてしまっていることに気づきました。
このずれを解決する方法はないのでしょうか？
ご存知の方がいらっしゃったら、ぜひとも教えていただきたく思います。
宜しくお願い致します。

回答No.1

ORUKA1951

印刷用スタイルシートは、すべての単位に絶対サイズ()を使いましょう。pxはディスプレイの解像度を参照する相対サイズです。(印刷の解像度は通常200～600dpiだと思います。)
★4.3.2 長さ（Lengths） ( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/syndata.html#length-units )
in: インチ -- 1inは2.54cmに等しい
cm: センチメートル
mm: ミリメートル
pt: ポイント -- 1ptは1/72inに等しい
pc: パイカ -- 1pcは12ptに等しい
4.3.2 長さ（Lengths） ( http://www.swlab.it.okayama-u.ac.jp/man/rec-css2/syndata.html#length-units )

　display:table|table-cell,table-lineなどは、ブラウザによる差が大きく、できればabsoluteなどを使うほうが無難です。
　コマ割でfloatを使うのはたくさんの問題を含んでいますからも使うべきではないでしょう。必要な場合でも一方にはfloatをかけません。