我在应用程序中使用引导程序，正如您在打印浏览器（左侧）时所见（下图） 打印时使用了非常小的宽度（右），因此响应式布局将所有右侧站点元素移动到左侧元素下方，并且打印版本不适合单个页面。
你知道如何强制浏览器保持正确的宽度吗？
谢谢，
雷莫
.
【问题讨论】：
media="screen" 属性：github.com/twitter/bootstrap/blob/master/docs/…
标签： printing twitter-bootstrap width
我有一个非常相似的问题。
确保只为media="screen" 启用responsive css 解决了它。
<link href="assets/css/bootstrap-responsive.css" rel="stylesheet" media="screen">
【讨论】：
bootstrap-responsive.css，只有bootstrap-combined.min.css 是包括响应式样式在内的所有内容，bootstrap.min.css 是除了响应式样式。作为一种解决方法，您可以使用单独的 media 设置加载两个文件：<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.1/css/bootstrap.min.css" rel="stylesheet" media="print"> 和 <link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet" media="screen">
bootstrap.min.css 包含响应式样式，但不应该。
对于 Bootstrap 3，这解决了我的问题：
@media print {
.container {
width:100%;
}
}
【讨论】：
@media print { body { width:992px; } } 感谢您的想法。
摆脱响应式风格就是答案！非常感谢！
我正在使用 rails twitter bootstrap，它重新编译了较少的源代码，所以只需一点说明它也可以这样工作（bootstrap_and_overrides.css.less 的第一行）：
@import "twitter/bootstrap/bootstrap.less";
@media screen {
@import "twitter/bootstrap/responsive.less";
}
哎呀：编辑，它在开发中运行良好，但在编译生产时会出错...必须为屏幕和打印版本构建 2 个不同的 bootstrap_and_overrides（寻找更清洁的解决方案）
【讨论】：