2014-01-22 1 views
2

아래는 html입니다. page-break-after:always을 넣었지 만 pdf 파일을 만들 때 페이지 나누기가 작동하지 않습니다.css page-break-after : 항상 테이블에서 작동하지 않습니다.

CSS

@media print { 
.encounter_form { position:relative; z-index: 0; left:0px; top:opx; } 
} 

div#page_break{ page-break-after:always;} 

HTML은

<div class='text encounter' style='margin:0px 0 0 0; padding:0px 0 0 0; border-style:dotted; border-color:white;'> 
    <h1>THIS IS A HEADER</h1> 
    <table> 
    <tr><td> 
     <span> </span><span class=text><br> 
     <span> </span><span class=text><br> 
    </td></tr> 
    </table> 

<DIV id='page_break' style='page-break-after:always;'></DIV> 
</div> 

<div class='text encounter_form' style='margin:0px 0 0 0; padding:0px 0 0 0; border-style:dotted; border-color:white;'> 
    <h1>Work Status Report</h1> 
    <br> 
    <div style='margin:5px 0 0 0; padding: 0px 0 0 0; border thin black solid;'> 

    <table cellpadding='2' cellspacing='0'> 
     <tr><td>blabla</td></tr> 
     <tr><td>blabla</td></tr> 
     <tr><td>blabla</td></tr> 
     <tr><td>blabla</td></tr> 
    </table> 
    <DIV id='page_break' style='page-break-after:always;'></DIV> 
    </div> 

답변

1

나는이 질문이 오래 실현,하지만 어쩌면 누군가가 어쨌든 도움이됩니다 ...

나는 저자 것으로 나타났습니다 빈 div를 삽입하여 페이지를 중단하지만 "이 속성은 상자를 생성하는 블록 요소에 적용되므로 상자를 생성하지 않는 빈에는 적용되지 않습니다."때문에 작동하지 않습니다. Mozilla reference.

나는 여기에 두 가지 솔루션을 참조하십시오

1) 추가 CSS 페이지 나누기 - 후 부모 DIV의 특성 :

.encounter, .encounter_form { 
    page-break-after: always; 
} 

완전히 ID = 'page_break'와 그 요소를 제거 :

<DIV id='page_break' style='page-break-after:always;'></DIV> 

그런데 ID는 고유해야하지만 여기에는 같은 ID의 두 요소가 있습니다.

2) 빈 div 안에 &nbps;을 삽입하십시오 (권장하지 않음)

관련 문제