Home/ Questions/Q 3946932
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-20T01:11:30+00:00

I need to display the following div’s as it is on the screen according

  • 0

I need to display the following div’s as it is on the screen according to the HTML, but when I print the Claimant Name, Case Info, Contacts, Files should print on 1st page and Claimant Name, Service should print on 2nd page.

Can someone please show me a way to solve it using CSS?

<body>        
    <div>Claimant Name</div>

    <div>Case Info</div>    

    <div>Contacts</div>

    <div>Files</div>

    <div>Service</div>
</body>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Same answer I posted at CSS Creator:

    DIV doesn’t lend any semantic meaning so there’s most definitely a better way to mark it up. It does involve adding a second name field but I don’t see that as any sort of problem.

    <!DOCTYPE html>
<html>
<head>
    <title>Le documents judiciaires</title>
    <style type="text/css" media="screen">
        #secondPage .name {
            display: none;
        }
    </style>
    <style title="text/css" media="print">
        #secondPage {
            page-break-before: always;
        }
    </style>
</head>

<body>
    <div id="firstPage">
        <div class="name">Claimant Name</div>
        <div>Case Info</div>
        <div>Contacts</div>
        <div>Files</div>
    </div>
    <div id="secondPage">
        <div class="name">Claimant Name</div>
        <div>Service</div>
    </div>
</body>
</html>
    • 0