html 如何修复使用mozilla firefox打印时被切断的页面

ffscu2ro 于 2023-02-10 发布在其他

关注(0)|答案(2)|浏览(222)

首先，我使用Angular ，我已经创建设置打印HTML使用window.print（）和样式与style.scss.一切都是确定的，当打印与Chrome浏览器，但对于Firefox浏览器不是.在Firefox上，页面被切断，我在哪里需要更新样式代码修复？
我有一个tableComponent.html + tableComponent.scss的内容表我将打印。我有添加溢出为选定的内容如下：

- 表格组件. scss**

#selectedHTML {
display: block;
height: 0px;
overflow: visible;
}

但不是工作

- 表格组件. scss**

#selectedHTML {
  display: block;
  height: 0px;
  overflow: visible;
}

但不是工作
我希望内容页面不会在Firefox上被切断

Html

来源：https://stackoverflow.com/questions/57518421/how-to-fix-pages-cut-off-when-printing-use-mozilla-firefox

2条答案

按热度按时间

8ljdwjyq1#

正如我所评论的可能是你的问题之一是你没有限制容器，或者可能是一个简单的 Package 问题.
希望这能帮助您：
CSS示例：

.border {
    border: 1px solid;
}
.container {
    max-width: 100%;
    overflow: visible;
    /*
      nowrap make it force cut off
      pre-line make it force wapr
    */
    white-space: pre-line;/**/
}    
.border.item {
    min-width: 558px;
    display: inline-block;
    height: 79px;
}

示例HTML：

<div class="container">
          <div class="border item" ></div>
          <div class="border item" ></div>
          <div class="border item" ></div>
          <div class="border item" ></div>
          <div class="border item" ></div>
          <div class="border item" ></div>
          <div class="border item" ></div>
          <div class="border item" ></div>
          <div class="border item" ></div>
          <div class="border item" ></div>
          <div class="border item" ></div>
          <div class="border item" ></div>
          <div class="border item" ></div>
          <div class="border item" ></div>
          <div class="border item" ></div>
          <div class="border item" ></div>
  </div>

赞(0）回复(0）举报 2023-02-10

doinxwow2#

我遇到过类似的问题，文章中的文本被切断，我发现display: block而不是flex或grid的父div修复了这个问题。

赞(0）回复(0）举报 2023-02-10