CSS formatting for PDF generation

2

I'm using a loop to generate a PDF file. Each iteration of the loop should generate a PDF page.

The problem is that a blank page is always coming out at the end of the generated PDF. I know this page is leaving because I'm using the CSS property

page-break-after:always

If I take out always , the page break is not correct. How can I resolve?

HTML

@foreach($provas as $p)
    <div class="page-break">
        <div class="row">
            <div class="col-md-12">
                <h3 class="text-center">DNA Prova</h3>
            </div>
         </div>
          <Restante do conteúdo da página>
     </div>
@endforeach

CSS

.page-break{
    page-break-after: always;
}
    
asked by anonymous 16.05.2017 / 13:20

1 answer

0

Try this:

<!DOCTYPE html>
<html lang="pt-br">
    <head>
        <title></title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
        <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script><style>.page-break{page-break-inside:avoid;page-break-after:always;}</style></head><body><divclass="container-fluid">
            <div class="page-break">
                <div class="row">
                    <div class="col-md-12">
                        <h3 class="text-center">DNA Prova1</h3>
                    </div>
                </div>            
                <div class="row">
                    <div class="col-md-12">
                        <h4 class="text-center">Conteudo 1</h4>
                    </div>
                </div>
            </div>

            <div class="page-break">
                <div class="row">
                    <div class="col-md-12">
                        <h3 class="text-center">DNA Prova2</h3>
                    </div>
                </div>
                 <div class="row">
                    <div class="col-md-12">
                        <h4 class="text-center">Conteudo 2</h4>
                    </div>
                </div>
            </div>

            <div class="page-break">
                <div class="row">
                    <div class="col-md-12">
                        <h3 class="text-center">DNA Prova3</h3>
                    </div>
                </div>
                 <div class="row">
                    <div class="col-md-12">
                        <h4 class="text-center">Conteudo 3</h4>
                    </div>
                </div>
            </div>
        </div>
    </body>
</body>
</html>
    
16.05.2017 / 14:10