сделать div в нижней части определенной страницы при печати

У меня есть таблица с переменным количеством строк. Я хочу распечатать эту таблицу через браузеры. Под ним есть div, который должен оставаться внизу страницы. Если таблица содержится на первой странице, div будет внизу первой страницы. Если переполнение таблицы на вторую страницу, DIV будет в нижней части второй страницы и так далее ... Мой первый подход должен был справиться с этим, как я делал в HTMLсделать div в нижней части определенной страницы при печати

.footer{ 
    width: 100%; 
     position: absolute; 
     bottom: 0; 
     font-size: 10pt; 
}

Этот не работает. нижний колонтитул остается на первой странице. Нужна ваша помощь, пожалуйста!

EDIT

Я сделал стол и нижние колонтитулы в родительском DIV так, что они могут петлю. Нижний колонтитул всегда будет на той же странице, что и конец таблицы. Извините, за мою неточность!

решаемые [Изменено]

я, наконец, сделал это, окружая колонтитул другой DIV и делать некоторые CSS следующим образом:

.table{ 
     min-height: 20cm !important;/* Define height for the table in cm or mm (I encountered a problem with px and %) */ 
     display: block; 
     position: relative; 
     width: 100% !important; 
    } 
    .footer{ 
     width: 100%; 
     position: relative; 
     margin-bottom: 0 !important; 
     font-size: 10pt; 
     page-break-inside: avoid !important; 
     page-break-before: auto !important; /* this pushes the footer to the bottom of next page if table overflows to another page */ 
    }

Единственная оставшаяся проблема, когда таблица соответствует точно первая страница: нижний колонтитул переместится на следующую страницу, но отображается сверху :( Спасибо за ответы на ваши вопросы! :)

источник

2016-06-09 Knighto05

Попробуйте использовать position: fixed; к этому div.

Он должен быть помещен внизу печатной страницы, если вы установили bottom: 0;

источник

2016-06-09 12:09:11 dolu92

вы» правильно, но я забыл упомянуть, что таблица и div зацикливаются! если я сделаю div фиксированным, он будет идти в конце документа не на той же странице с концом таблицы. – Knighto05

Нет, если вы установили div в фиксированное положение, оно будет повторяться в нижней части всех страниц. Но насколько я знаю, вы хотите очистить оставшуюся часть страницы, на которой закончилась таблица, а затем, внизу этой страницы, вы хотите поместить нижний колонтитул? После этого следующая страница начинается с новой таблицы, которая охватывает более 3 страниц, поэтому на 3 страницах у вас есть следующий нижний div? Поправьте меня если я ошибаюсь. – dolu92

Да, вы поняли! Я попытался «position: fixed;» и он работал как прелесть для первой итерации, но затем нижний колонтитул появился на каждой странице даже до конца. Я не знаю почему! – Knighto05

Я сделал свой нижний колонтитул на дне дивы и следил за ним.

Если я правильно понимаю, вы хотите, чтобы нижние колонтитулы в конце стола, вот как я это сделал:

#footer { 

    background-color: #333; 
    clear:both; 
    bottom: 0; 
    width: 1200px; 
    height: 50px; 
    margin: 0 auto; 
    border-radius:0px 0px 10px 10px; 
}

и Параграф в сноске:

#paragraf_1 { 
     display:block; 
    color:white; 
    text-align:bottom-left; 
    padding:14px 16px; 
    text-decoration:none; 
}

источник

2016-06-09 12:23:14

сделать div в нижней части определенной страницы при печати

ответ

Смежные вопросы