PrintThis переопределяет пользовательский CSS при нажатии кнопки

Question

Я использую плагин PrintThis JQuery.
Я использую Bootstrap в качестве рамки.

При печати с помощью PrintThis я хотел бы уменьшить размер шрифта.
Я только что изменил стиль в документе. например:

<style> 
body { 
    font-size: 8px; 
    line-height: 1.42857143; 
} 
</style> 

При первой загрузке страницы. Весь текст 8px.
Но когда я нажимаю кнопку PrintThis, страница перезагружает/изменяет весь текст на Bootstrap по умолчанию 14px. Почему?

HTML для printButton

<button class="btn btn-default pull-right" id="print_btn"><span class="glyphicon glyphicon-print" title="Print"></span></button> 

JS для printThis

<script> 
$(document).ready(function() { 
    $('#print_btn').click(function() { 
     $('#usr_name, #list_usr_time, #sum_worked_time, #break_page').printThis(); 
    }); 
}); 
</script> 

UPPDATE я переехал стиль со страницы, в файл CSS.
Затем я загрузил файл css на страницу.
Также я добавил: loadCSS: «css/custom_printthis.css», к пользовательскому JQuery.
В результате страница не отменяет css. Текст 8px, так же, как я хочу. НО, когда я нажимаю Print, предварительный просмотр показывает текст 14px внутри тегов таблицы ... и текст 8px снаружи. Maby мне нужно добавить «table.tex» в моем css ...

Answer 1

Чтобы исправить это, я создал новый класс для всего текста, напечатанного php.
Затем я создал файл CSS для этого класса и обрел первоначальный размер шрифта Bootstrap.

<td class="table_text">Text</td> 

.table_text{ 
    font-size: 10px; 
}