Bootsrap＃sidebar-wrapper在打印时占用某些浏览器的空间

Question

从twitter bootstrap appplication打印时出现问题。 https://hod-nav.herokuapp.com/members/H0252# 尝试使用打印按钮时，或只是文件＆gt;打印时，＃sidebar-wrapper仍占用打印页面上的不动产。

仅在PC Safari，Mac Safari和Mac Firefox中出现。

我正在使用BS 3.3.6。

我做了很多事情。

•我的CSS设置为媒体：＆＃39;所有＆＃39; •我一直在玩BS打印样式表，如此......

    @media print {
     #sidebar-wrapper {
    display: none !important;
    visibility: hidden !important;
    }

•我添加了神秘的类=＆＃34; hidden-print＆＃34;对于有问题的元素。

•我能够隐藏不需要像上面那样打印样式表的东西。

•我还从级联中添加了额外的选择器，以非常具体地定位元素。

正如您从单击打印按钮或只是基本的CTRL / CMD + P所看到的，上面列出的问题浏览器希望保持左侧250px +空白区域，而允许主容器div与地图一致在其中以与其他浏览器一样的全宽度打印。

只是想知道是否有其他人在这些浏览器或其他人中遇到过这个问题。

我很高兴证明了其他信息。

提前感谢阅读和思考。

此致 迪克

Answer 1

不是#sidebar-wrapper占用了布局中的空间，它是主要元素的左边填充，您需要在打印时禁用它：

@media print {
  #wrapper {
   padding-left: 0;
  }
}

这需要放在样式的末尾，以覆盖#wrapper内的@media (min-width: 768px)选择器。或者，您可以使用div#wrapper代替#wrapper，无论其在CSS文件中的位置如何，它都将适用。

顺便说一下，这些id都没有与Twitter Bootstrap有关。

Answer 2

看起来你的包装元素中有填充 - ＆gt;

#wrapper { padding-left:250px;}