2016-12-14 18 views
2

私は現在、cssを使用してウェブサイト(wordpress)を印刷する過程にあり、A4に印刷すると特定のページでは完全に空白の最後のページを残します(例:http://takana.co.nz/?page_id=25 )。Google chromeは余分なページを印刷します

Google Chromeの開発ツールと「CSSメディアをエミュレートする」を使用して印刷をシミュ​​レートすると、コンテンツの最後に余白が追加されることはありません。

すぐに結論は、何かがフッタのテキストを超えて空白を追加しているのですが、印刷されたページ上の要素を調べて見つけることができないということです。


クロムで印刷プレビューを使用すると、余分なページが表示される原因は何ですか?

答えて

1

問題がpaddingであるようです。メディア印刷の場合はpadding.entry-wrapに調整してください。

が、これは何らかの方法(y)をお手伝いします

@media print { 
.entry-wrap { 
    padding: 25px; /* adjust it accordingly */ 
} 
} 

・ホープ以下のようなものになる可能性があります。

2

私は印刷しようと、それは1ページだった、あなたはCSSで

@media print { 
    html, body { 
     border: 1px solid white; 
     height: 99%; 
     page-break-after: avoid; 
     page-break-before: avoid; 
    } 
} 

後のプレビューを参照してくださいをコードに続いすなわちフッターに

@media print { 
    footer {page-break-after: avoid;} 
} 
+1

フッタは全く印刷されないように設定されていますが、いくつかの場所に配置してみます: '@media print footer {display:none;} ' – HexaCubist

+1

実際には、人々はインクを節約します。私はそれを行うとき、私はちょうど人々が必要なので、H1とコンテンツを残します。 –

1

使用を避ける前に、アフター印刷ブレークを追加してみてくださいCSSを追加する。

enter image description here

関連する問題