Skip to content Skip to sidebar Skip to footer

Dompdf Default Page Header Content Overlap

I have small problem in pdf creation from dompdf. In html page header position:fixed the content is overlaped on the header the page.the content of the page is dynamically loading.

Solution 1:

Positioned content is currently placed according to the primary content container, or body element. To ensure there is no overlap add a margin to the page then position your content negatively to move it outside the body (#header { position: fixed; top: -50px; left: 0px; right: 0px; height: 50px; }).

For example:

<html><head><style>@page { margin: 50px; }
    body { background-color: #c0ccff; padding: 1em; }
    #header { position: fixed; top: -50px; left: 0px; right: 0px; height: 50px; background-color: orange; padding: .5em; text-align: center; }
  </style></head><body><divid="header">HEAD</div><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tempor gravida enim, id sollicitudin eros ullamcorper a. Cras vitae convallis dolor. Maecenas eget fermentum magna. Donec gravida neque vel sapien congue consequat. Nulla facilisi. Sed volutpat dui et nibh posuere, eu malesuada arcu congue. Cras vehicula elit eros, non tristique leo congue quis. Morbi aliquam scelerisque augue, eu sodales dolor. Integer a commodo nibh. </p><divstyle="page-break-before: always;"></div><p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut tempor gravida enim, id sollicitudin eros ullamcorper a. Cras vitae convallis dolor. Maecenas eget fermentum magna. Donec gravida neque vel sapien congue consequat. Nulla facilisi. Sed volutpat dui et nibh posuere, eu malesuada arcu congue. Cras vehicula elit eros, non tristique leo congue quis. Morbi aliquam scelerisque augue, eu sodales dolor. Integer a commodo nibh. </p></body></html>

Post a Comment for "Dompdf Default Page Header Content Overlap"