打印css样式表——div定位答案

【问题标题】：Print css stylesheet - div positioning打印css样式表——div定位
【发布时间】：2011-05-25 22:23:14
【问题描述】：

您好，我刚刚完成了我的网站。我的打印风格有问题。我的html如下：

<div id="container">
<div id="main">
       <h1>title</h1>
        <div class="blockright">image in here and text</div>
         <p>paragraphs of text</p>
<div class="blockleft">image in here and text</div>
 <p>Even more paragraphs of text</p>

 <div class="clear"></div>

 <div class="footer">Copyright here</div>
</div>
</div>

.blockright 具有固定宽度并向右浮动

.blockleft 的宽度是固定的，floats left 的宽度是 auto

.main 有一个宽度并包含内容

在我的打印 css 中，我希望 .blockleft 和 .blockright 在页脚之前与打印页面的底部对齐。网站上的每个页面都必须是可打印的，我不想手动重新定位页面以打印文章，或者必须为每个页面设置自定义样式才能正确打印。有谁知道如何让 div 与页面底部对齐。我尝试了绝对定位，但我无法让它工作。有什么想法吗？

在此先感谢

【问题讨论】：

现在怎么样，用jsfiddle

标签： html css printing stylesheet

【解决方案1】：

在您的打印样式表中

 #main {
   position:fixed;
   bottom:0;
   left:0;
   display:block
}

如果您不希望所有#main 都进入底部，只需将另一个 div 包裹在 .blockleft 和 .blockright 周围并将此 css 应用到它。唉，这在 IE6 中可能不起作用，但是您可以尝试应用一些用于将粘性页脚应用于页面的技术。这是一个例子http://ryanfait.com/sticky-footer/

【讨论】：