印刷に適したバージョンでは、ここでの情報

Question

の2列を印刷しようとすることは、二つの列

view the page here

ですべてを一覧表示されますので、私は、印刷がフレンドリーにしようとしているページはここではdiv要素のCSSです私はページを印刷するために行くときの情報の各ブロックは、それが唯一の代わりに、それはページにどのように見えるかを、1列にそれを印刷し、

#off-campus-print-friendly { 
    font-family:arial; 
    border:1px solid red; 
    overflow:auto; 
    font-size:.8em; 
    line-height:1.5em; 
    padding:10px; 
} 

#off-campus-print-friendly div { 
    width:45%; 
    float:left; 
} 

#off-campus-print-friendly p { 
    margin:5px 0; 
} 

です。

何か助けていただければ幸いです。

Answer 1

があなたのページ（放火魔）上のソースを編集することによって、画面と印刷

<link rel="stylesheet" type="text/css" media="screen, print" href="http://www.herkimer.edu/?css=styles/print.v.1245694939" charset="utf-8" /> 

はこれをテストするスタイルシートにあなたのリンクを変更し

、それが動作します。

Answer 2

ベストプラクティスは、元のページに含まれている印刷専用の2番目のCSSファイルが必要です。これにより、第2の印刷フレンドリーページの必要性を排除します。

また

<link rel="stylesheet" type="text/css" media="print" href="print.css" charset="utf-8" /> 

Answer 3

、あなたではなく、単一のスタイルシートは、すべてのメディアに応える必要があるだろう場合、あなたはこの使用することができます。また、

<link rel="stylesheet" type="text/css" media="all" href="master.css" charset="utf-8" /> 

をとすることができますCSSファイル内のブロックを使用して、次のような媒体固有のスタイルを分離します。

@media print { 
    p { font-size: 14pt; } 
} 
@media screen { 
    p { font-size: 12pt; } 
}