печати Версия для печати, пытаясь напечатать 2 колонки информации

Question

Вот страница, которую я пытаюсь сделать печать дружественные, поэтому он будет перечислять все в двух столбцах

view the page here

Вот CSS-код для DIV каждый блок информации в

#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" /> 

Испытано отредактировав источник на странице (Firebug), она работает.

Answer 2

Лучшая практика заключается в том, что у вас должен быть 2-й файл css специально для печати, включенный на исходную страницу. Это устраняет необходимость в второй печати для печати:

<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; } 
}