HTML to PDF / DOCX / RTF Java converter library › Forums › PD4ML Forums › Technical questions / Troubleshooting › inline-block with width auto not working properly with nested elements
- This topic has 3 replies, 1 voice, and was last updated Jan 13, 2020
17:31:15 byRekha Tavvala.
Viewing 4 posts - 1 through 4 (of 4 total)
-
AuthorPosts
-
January 13, 2020 at 17:25#33872
Hi pd4ml,
We have some markup where there is nested div structure and we are applying display:inline-block to the top level
<div>.
Seems like inline-block with width auto is not working in case of nested structures. Please find the markup and generated PDF in attachment.Note : We are using pd4ml-4.0.6 jar
Is it possible to provide a fix (or)
Can you please suggest some css which will work with pd4ml? (In browser, the output is proper)Thanks,
RekhaAttachments:
You must be logged in to view attached files.January 13, 2020 at 17:27#33874Please find the markup we are using:
<html> <head> <style> .content-sub_section { display : inline-block; width : auto; } .content-field { width : 50%; display : inline-block; float : left; } </style> </head> <body> <div class='layout-content-inline'> <div class='content-sub_section'> <div> <div> <div class='parent'> <div class='layout-content-inline_grid_double'> <div class='content-field'> <div> <div> <span>100</span> </div> </div> </div> <div class='content-field'> <div> <div> <span>King</span> </div> </div> </div> <div class='content-field'> <div> <div> <span>50</span> </div> </div> </div> </div> </div> </div> </div> </div> <div class='content-sub_section'> <div> <div> <div class='parent'> <div class='layout-content-inline_grid_double'> <div class='content-field'> <div> <div> <span>101</span> </div> </div> </div> <div class='content-field'> <div> <div> <span>Mark</span> </div> </div> </div> <div class='content-field'> <div> <div> <span>70</span> </div> </div> </div> </div> </div> </div> </div> </div> </div> </body> </html>January 13, 2020 at 17:29#33875<html> <head> <style> .content-sub_section { display : inline-block; width : auto; } .content-field { width : 50%; display : inline-block; float : left; } </style> </head> <body> <div class='layout-content-inline'> <div class='content-sub_section'> <div> <div> <div class='parent'> <div class='layout-content-inline_grid_double'> <div class='content-field'> <div> <div> <span>100</span> </div> </div> </div> <div class='content-field'> <div> <div> <span>King</span> </div> </div> </div> <div class='content-field'> <div> <div> <span>50</span> </div> </div> </div> </div> </div> </div> </div> </div> <div class='content-sub_section'> <div> <div> <div class='parent'> <div class='layout-content-inline_grid_double'> <div class='content-field'> <div> <div> <span>101</span> </div> </div> </div> <div class='content-field'> <div> <div> <span>Mark</span> </div> </div> </div> <div class='content-field'> <div> <div> <span>70</span> </div> </div> </div> </div> </div> </div> </div> </div> </div> </body> </html>January 13, 2020 at 17:31#33876`
<html> <head> <style> .content-sub_section { display : inline-block; width : auto; } .content-field { width : 50%; display : inline-block; float : left; } </style> </head> <body> <div class='layout-content-inline'> <div class='content-sub_section'> <div> <div> <div class='parent'> <div class='layout-content-inline_grid_double'> <div class='content-field'> <div> <div> <span>100</span> </div> </div> </div> <div class='content-field'> <div> <div> <span>King</span> </div> </div> </div> <div class='content-field'> <div> <div> <span>50</span> </div> </div> </div> </div> </div> </div> </div> </div> <div class='content-sub_section'> <div> <div> <div class='parent'> <div class='layout-content-inline_grid_double'> <div class='content-field'> <div> <div> <span>101</span> </div> </div> </div> <div class='content-field'> <div> <div> <span>Mark</span> </div> </div> </div> <div class='content-field'> <div> <div> <span>70</span> </div> </div> </div> </div> </div> </div> </div> </div> </div> </body> </html> -
AuthorPosts
Viewing 4 posts - 1 through 4 (of 4 total)
You must be logged in to reply to this topic.
