Skip to content Skip to sidebar Skip to footer

Draw A Border Around Each Page On Print Css?

I need to draw a border around each page when printing. I had originally done this using divs with pagebreak like: @media print { .contentContainer { position: inline; height: 98%;

Solution 1:

I recommend you to limit the content in a page and then, you can create a simple DIV element with the page-break class.

<!-- content block --><divclass="page-break"></div><!-- content block -->

The CSS:

@media print{
    .page-break { 
        height:2px; 
        border-top:1px solid #999; 
        margin-bottom:13px;
        page-break-after: always;  
    }
}

Also, you can insert a page break before each h1 element or after a section:

h1 {page-break-before: always;}
 section {page-break-after: always; border-bottom:1px solid #999;}

I hope this will help you!

Post a Comment for "Draw A Border Around Each Page On Print Css?"