2011-08-16 24 views
8

画面上に問題のないページがあります。css印刷スタイリング

私は、スクリーンを印刷用にフォーマットし、セクションのサイズを変更します。

私の問題は、印刷レイアウトには、ページの左側から約1インチの余白があり、2つの要素が右側のページから印刷されるということです。

私はおそらく右からのコンテンツを圧縮することができますが、私は、私は左のマージンを減らす(と基本的に内容をセンタリングする)ことができるかどうかを知りたい

私はmargin:0;padding: 0;に印刷上のbodyタグを設定しているが、これは効果がありませんか?

印刷マージンを制御する別の設定がありますか?

+2

はい、あなたのウェブページからは触れません。ブラウザの「印刷設定」を見てください。 – thirtydot

答えて

17

あなたは次のようにCSSで印刷マージン(と横向き)を設定することができます

@media print { 
    @page { 
     size: letter landscape; 
     margin: 4.0cm; 
    } 
} 


そして、良いニュースは、それが動作する、です! (Chromeの場合Not supported on other browsersですが、私はIE9をテストしませんでした)

余白は、印刷に意味のある単位である必要があります。ピクセルは使用できません。

Chromeは、プリンタドライバによって決まる固定最小値を下回ってマージンを縮小しません。

+0

"マージンは印刷で意味をなさない単位でなければなりません - ピクセルは許されません。"この。 '' margin:0''はここでは働いていなかった。 'margin:0in''はそうです。 –

0

またhtmlmain content divpタグに

margin:0;

padding:0;

を設定し、それが助けかどうかを確認しようとすることができます。

それ以外の場合は、あなたの要素に特定のwidthを設定することをお勧めします。