html - 打印模式下 twitter bootstrap 表中的某些行宽度错误且无边框

Question

这是一张表格在正常模式下的样子(桌面屏幕)

但是当我尝试打印它时(按 ctrl + p)我看到了这个:

但如果我尝试在 chrome 模拟器模式下使用打印媒体显示它，它看起来不错。这是表格的 html:

<table class="table table-striped table-bordered">
    <tbody>
      <tr>
        <td class="col-md-6">Этаж</td>
        <td>2</td>
      </tr>
      <tr>
        <td class="col-md-6">Общая площадь</td>
        <td>40.3</td>
      </tr>
      <tr>
        <td class="col-md-6">Площадь кухни</td>
        <td>7.6</td>
      </tr>
      <tr>
        <td class="col-md-6">Жилая площадь</td>
        <td>40.3</td>
      </tr>
      <tr>
        <td class="col-md-6">Год постройки</td>
        <td>1997</td>
      </tr>
      <tr>
        <td class="col-md-6">Готовность</td>
        <td>100</td>
      </tr>
      <tr>
        <td class="col-md-6">Отопление</td>
        <td>Печное</td>
      </tr>
      <tr>
        <td class="col-md-6">Вода</td>
        <td>Холодная</td>
      </tr>
    </tbody>
  </table>

Answer 1

哦，我不明白为什么，但我没有 position: static 规则

table td[class*="col-"],
table th[class*="col-"] {
  float: none;
  display: table-cell;
  position: static;
}