打印css样式表 - div定位

时间:2011-05-25 22:23:14

标签: html css printing stylesheet

您好,我刚刚完成了我的网站。我的打印样式有问题。我的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有一个固定的宽度,左边的浮点数宽度为auto

.main有一个宽度并容纳内容

在我的print css中,我希望.blockleft和.blockright在页脚之前与打印页面的底部对齐。网站上的每个页面都必须是可打印的,我不想手动重新定位页面来打印文章,或者必须为每个页面打印一个自定义样式才能正确打印。有谁知道如何将div对齐到页面底部。我试过绝对定位,但我无法让它发挥作用。有什么想法吗?

非常感谢提前

1 个答案:

答案 0 :(得分:2)

在您的打印样式表中

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

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