Распечатать таблицу стилей CSS - позиционирование div - PullRequest
Новая
       19

Распечатать таблицу стилей CSS - позиционирование div

1 голос
/ 26 мая 2011

Привет, я только что закончил свой сайт. У меня проблемы с моим стилем печати. Мой 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 имеет ширину и содержит содержимое

В моей распечатке css я бы хотел, чтобы .blockleft и .blockright были выровнены по нижней части напечатанной страницы перед нижним колонтитулом. Каждая страница на сайте должна быть пригодна для печати, и я не хочу вручную перемещать страницу для печати статьи или иметь собственный стиль для каждой страницы для правильной печати. Кто-нибудь знает, как выровнять div по нижней части страницы? Я попробовал абсолютное позиционирование, но не смог заставить его работать. Есть идеи?

Большое спасибо заранее

1 Ответ

2 голосов
/ 26 мая 2011

в вашей таблице стилей печати 

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

Если вы не хотите, чтобы все #main уходили на дно, просто оберните еще один div вокруг .blockleft и .blockright и примените к нему этот CSS.Увы, это, вероятно, не сработает в IE6, однако вы можете попробовать применить некоторые методы, используемые для наложения липкого нижнего колонтитула на страницу.вот один пример http://ryanfait.com/sticky-footer/

...