Rank: Member
Groups: Member
Joined: 7/10/2012
Posts: 14
|
I am using EO.pdf dll to convert an ASPX page to PDF. The problem is that I have a section in the ASPS where the customer need to keep an information together in the same page. The HMTL section is something like this <Table> <TR> <TD> <Label1> <grid1....> <Label2> <grid2....> <div style="page-break-inside: avoid"> <Label3> <grid3....> </div> </TD> <TD> <Image.....> </TD> </TR> </Table> The problem is when the Label3 and Grid3 break to a new page, the botton of the image also break. ¿Why This Happens? It is assumed that the image should be complete in the first page. PD: The image is generated by System.Web.UI.DataVisualization.Charting namespace.
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,196
|
Hi,
In that case you can apply page-break-inside: avoid on the TR instead on on the DIV. page-break-inside: avoid only control where page-break occurs. It does not change layout. So for example, if the top of your DIV is aligned to the top of your image, then no matter what you do with page-break, the will still be aligned. In another word, page-break only decide where to divide, it does not move things.
Thanks!
|
Rank: Member
Groups: Member
Joined: 7/10/2012
Posts: 14
|
Thanks for your quick answer.
In my case appliying "page-break-inside: avoid" to the TR will not help because the image always is the same size and it fit in the TD on first page. When I delete the page-break-inside: avoid" from the fisrt TD the image keeps on the first page and part of the grid breaks no the next page.
I would like you bring me an email where I can send you images of the real generated PDF because I dont know how to attach it here to the post.
Thanks in advance for your support
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,196
|
Hi,
You can post the image somewhere else or on your own server and then post a link in the forum.
Thanks!
|
Rank: Member
Groups: Member
Joined: 7/10/2012
Posts: 14
|
|
Rank: Administration
Groups: Administration
Joined: 5/27/2007
Posts: 24,196
|
Hi,
You will want to adjust your HTML layout to avoid this problem. If I understand your question correctly, then there is no possible way to keep the Grid and the image together at the same time without adjusting your HTML.
As we have mentioned in our previous post, the key to understand the paging process is that paging process never change HTML layout. In your example, let's say the position of each elements are like this:
Grid Activos: Top = 0, Bottom = 300
Grid Operaciones de Creditos: Top = 300, Bottom = 500
Image: Top = 0, Bottom = 400
The top and bottom values decide the layout. That means in your current layout, the Grid Operaciones de Creditos and the image will always over lap by 100 pixels no matter what --- because the top of the Grid is 300 and the bottom of the image is 400. The only thing the paging process decide is where to "cut" the contents into a separate page. It does not move one element relative to another. This means if the relative relation between the Grid Operationces de Creditos and the image is that the image's bottom is below the Grid's top by 100 before the paging process, the image's bottom will still be below the Grid's bottom by 100 after the paging. That is, the relative relationship between different elements (in another word, the layout) never changes before and after paging. When you put page-break-inside:void to Grid Operaciones de Creditos, it tells the paging process NOT to break between 300 and 500 and that's it. It does not reposition the Grid or the image.
This means if you want the Grid Activos and the image to stay on the first page and Grid Operaciones de Creditos on the second page, you have to adjust your HTML so that Grid Operaciones de Creditos and the image does not overlap at all before the paging. For example, you can put Grid Activos and the image in one table row and Grid Operaciones de Creditos on the next table row to achieve that. If that is not an acceptable result on screen, then you may want to write your code to check whether you are doing HTML to PDF conversion and only create the two row structure when your page is being converted to HTML.
Hope this helps. Please feel free to let us know if you have any more questions.
Thanks!
|