2015-03-11 3 views
6

У меня странная ошибка, когда я хочу распечатать мою веб-страницу в Chrome. Я показываю таблицу с использованием Bootstrap, которая идеально подходит для размера экрана (независимо от размера экрана). Когда я хочу распечатать веб-страницу в Chrome, таблица обрезается, а макет печати идеально подходит для Firefox.Ошибка при печати таблицы Bootstrap на Chrome

Мне удалось воспроизвести мою ошибку на JSFiddle here.

HTML-код моей таблицы:

<table class="table table-condensed"> 
    <thead> 
     <tr> 
      <th>Col1</th> 
      <th>Col2</th> 
      <th>...</th> 
     </tr> 
    </thead> 
    <tbody> 
     <tr ng-repeat="..."> 
      <td>...</td> 
      <!-- ... --> 
     </tr> 
     <tr class="separator empty" /> 
    </tbody> 
</table> 

Есть ли у вас какие-либо идеи, чтобы решить эту проблему?
Возможно, с помощью другого класса Bootstrap css для таблицы?

ответ

4

Указание начального размера зума напечатало все содержимое.

@media print { 
    body { 
     zoom: .8 
    } 
} 

Fiddle: http://jsfiddle.net/HB7LU/11671/

+0

Спасибо, это все еще странная ошибка, но ваш обходной способ сделал трюк – bviale

+0

Просто обходной путь, а не исправление. Не помогло в моем случае. – Chad

1

Существует известная ошибка в Bootstrap 3, что он, кажется, был отложен до Bootstrap 4. ошибка имеет отношение к отзывчивости применяется в печатных стилей.

В моем случае, сменив все мои классы col-sm-* на col-xs-*, отлично работал.

Смежные вопросы