#233 css margin missing since upgrading to the latest version once converted to pdf

[fayme.shahriar]

We have recently upgraded htmlcleaner to version 2.26 from 2.2. We have been converting html into pdf and with the upgrade now seems like css is breaking up. Specially the margin. The css we have been using which was working fine:

<style>
  /* Mixins */ /* Global Settings */ *, *:after, *:before { -webkit-box-sizing: border-box; -moz-box-sizing: content-box; box-sizing: border-box; }  input, textarea, button, select, a { -webkit-tap-highlight-color: transparent; }  .clearfix:before, .clearfix:after { content: ' '; display: table; }  .hide { display: none; }  .noscroll { overflow: hidden !important; } /* General layout */ html { -webkit-text-size-adjust: 100%; }  html, body { height: 100%; font-size: 14px; ; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }  body { font-family: 'Arial', 'Helvetica', sans-serif; font-weight: normal; color: #000000; background: #e2e1e0; }  pre { white-space: pre-wrap; }  table.is_econtract { /* background-color:#efefef; border-bottom:1px solid #dedede; */  }  #debug-input, #debug-output { display: block; padding: 9.5px; margin: 0 0 10px; font-size: 13px; line-height: 1.42857143; color: #333; word-break: break-all; word-wrap: break-word; background-color: #f5f5f5; border: 1px solid #ccc; border-radius: 4px; -ms-word-break: break-all; word-break: break-all; word-break: break-word; -webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto; padding: 20px; }  #appFooter { border-top: 1px solid #444; display: block; padding-top: 20px; }  #appFooter p { width: 45%; }  #appFooter .right { text-align: right; }  #pageHeader, #pageFooter { display: none; }  #pageHeader img { width: 29mm; height: 29mm; }  u { text-decoration: underline; }  b { font-weight: bold; }  strong { font-weight: 600; }  .tleft, .txt-left { text-align: left; }  .tcenter, .txt-center { text-align: center; }  .tright { text-align: right; }  .highlightedText { background: yellow; }  .chapternumber { position: static; }  .container { width: 100%; margin: 0 auto; }  #mainwr { width: 95vw; margin: 15px auto 40px auto; padding: 40px 40px 80px 40px; background-color: #ffffff; box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.2); }  table { width: 100%; border-spacing: 0; border-collapse: collapse; }  .chapter { color: #5e5e5e; } /* reading progress bar */ .article { margin-top: 30px; }  .progress-container { position: fixed; width: 100%; height: 10px; background-color: #DDD; top: 0px; left: 0px; }  #progress-bar { position: absolute; float: left; height: 100%; background-color: #084a31; } /* readonly view */ #readonly-view { background: #fff; border-radius: 2px; margin-top: 30px; padding: 16px 24px; }  #readonly-view table { margin: 0 auto; margin-bottom: 30px; }  table#footer { margin-bottom: 0; }  table#footer td { vertical-align: bottom; }  #footer p { font-size: 12px; }  #readonly-view td { padding: 10px 0px 10px 20px; vertical-align: top; }  #readonly-view td:first-child { max-width: 60px; width: 10px; text-align: center; padding-left: 0; padding-right: 0; }  #readonly-view td p { line-height: 1.2em; }  .readonly-view { background-color: #fff; -webkit-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1); -moz-box-shadow: 0 0 4px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1); box-shadow: 0 0 5px rgba(0, 0, 0, 0.2), inset 0 0 50px rgba(0, 0, 0, 0.1); }  #saveBtn:focus { outline: none; }  #saveBtn { color: #fff; border: none; cursor: pointer; position: fixed; top: 50%; margin-top: -25px; background: #084a31; box-shadow: 0px 0px 10px 1px rgba(0, 0, 0, 0.1); text-align: center; padding: 5px; width: 50px; height: 50px; border-radius: 0 !important; right: 0; } /* inner tables: */ #mainwr #readonly-view table table tr>td, #mainwr #readonly-view table table tr:first-child>td, #mainwr #readonly-view table table tr:first-child>td:first-child { text-align: left; }  #mainwr #readonly-view table table tr>td:first-child { vertical-align: middle; }  #mainwr #readonly-view table table tr>td:nth-child(2), #mainwr #readonly-view table table tr>td:nth-child(3), #mainwr #readonly-view table table tr>td:nth-child(4), #mainwr #readonly-view table table tr>td:nth-child(5), #mainwr #readonly-view table table tr>td:nth-child(6), #mainwr #readonly-view table table tr>td:nth-child(7), #mainwr #readonly-view table table tr>td:nth-child(8), #mainwr #readonly-view table table tr>td:nth-child(9), #mainwr #readonly-view table table tr>td:nth-child(10), #mainwr #readonly-view table table tr>td:nth-child(11), #mainwr #readonly-view table table tr>td:nth-child(12) { text-align: right; vertical-align: middle; }  #mainwr #readonly-view table table tr td:first-child { text-align: left; }  #mainwr #readonly-view table table { width: 100%; }  #mainwr #readonly-view table table tr, #mainwr #readonly-view table table td { width: auto !important; }  #mainwr #readonly-view table table td:first-child { width: 60% !important; min-width: 60% !important; max-width: 60% !important; }  #mainwr #readonly-view table table.between { text-align: left; }  #mainwr #readonly-view table table.between tr>td:nth-child(1) { min-width: 80px !important; width: 80px !important; text-align: left; }  #mainwr #readonly-view table table.between tr>td:nth-child(2) { min-width: 20px !important; width: 20px !important; padding: 0; text-align: left; }  #mainwr #readonly-view table table.between tr>td:nth-child(3) { min-width: 50px !important; width: 50px !important; text-align: left; }  #mainwr #readonly-view table table.signature { width: auto; text-align: left; display: inline-block; }  #mainwr #readonly-view table table.signature td { width: auto; min-width: 0; min-height: 0; }  #mainwr #readonly-view table.signature tr td, #mainwr #readonly-view table.signature tr:first-child>td, #mainwr #readonly-view table.signature tr:first-child td:first-child { text-align: left; } /* rows */ #readonly-view table.not_econtract tr { border-bottom: 1px solid #adadad; }  #readonly-view table.not_econtract tr:last-child, #readonly-view table.not_econtract tr[data-id='TEXT_ID'] { border-bottom: none; }  #readonly-view table.not_econtract tr:nth-child(2n) { background-color: #f3f3f3; }  #readonly-view table.not_econtract tr:first-child { border-bottom: none; }  #readonly-view table.not_econtract tr[data-id='TEXT_ID'] { background-color: #fff; }  #readonly-view table.not_econtract td.longrow { background-color: #428c70; color: #fff; } /* layout minor changes june */ #mainwr #readonly-view table table.childDUMP tr>td { text-align: left; }  #mainwr #readonly-view table table.childDUMP td:first-child { max-width: 30% !important; width: 30% !important; }  #mainwr #readonly-view table table.childDUMP td:nth-child(2) { max-width: 25% !important; width: 25% !important; }  #mainwr #readonly-view table table.childDUMP td:nth-child(3) { max-width: 10% !important; width: 10% !important; }  #mainwr #readonly-view table table.childDUMP td:nth-child(4) { max-width: 20% !important; width: 20% !important; }  #mainwr #readonly-view table table.childDUMP td:nth-child(5) { max-width: 15% !important; width: 15% !important; }  #mainwr #readonly-view table table.autoTable td:first-child { width: auto !important; }  #mainwr #readonly-view table table.autoTable td { text-align: left !important; }  body *, table p, table span { font-size: 12px; line-height: 1.4em; }  #readonly-view td p { line-height: 1.2em; margin: 5px 0; }  #readonly-view .contract-wr>table td { padding-top: 0; padding-bottom: 0; }  #readonly-view .contract-wr>table table td { padding-top: 10px; padding-bottom: 10px; }  @media ( min-width : 768px) { .container { width: 100%; } }  @media ( min-width : 992px) { .container { width: 100%; } }  @media ( min-width : 1200px) { .container { width: 100%; /* 1170px */ } } /* PDF layout */ .page-break { display: block; page-break-before: always; }  @page { margin: 34mm 20mm 30mm 20mm; size: a4 portrait; @ top-left {content: element(pageHeader); }  @ bottom-left { content: element(pageFooter); }  } @page :right { @ bottom-left-corner {content: counter(page) '/' counter(pages); }  } @page :left { @ bottom-left-corner {content: counter(page) '/' counter(pages); }  } #pageHeader { position: running(pageHeader); }  #pageFooter { border-top: 1px solid #444; padding-top: 10px; position: running(pageFooter); }  #pageFooter p.left { margin-left: 24px; }  @media print { * { -webkit-print-color-adjust: exact; print-color-adjust: exact; } html, body { background: #fff; } #appFooter { display: none; } #pageHeader, #pageFooter { display: block; } #pageFooter p { width: 46%; } #pageFooter .left p { margin-left: 10px; } #pageFooter .right { text-align: right; } #mainwr { width: 100%; margin: 0 auto; padding: 0; box-shadow: none; } .save-btn-wr { display: none; } #readonly-view, .container { width: 100%; padding: 0; margin: 0; position: static; } #pageFooter p { position: relative; left: 20px; } #readonly-view table.not_econtract td, #readonly-view table.not_econtract td p { font-size: 10px; } #mainwr #readonly-view table.not_econtract td:first-child { width: auto !important; min-width: auto !important; max-width: auto !important; } #readonly-view table { margin-botom: 10px; } #readonly-view td p { margin-bottom: 0; padding-bottom: 0; } #readonly-view td { padding-bottom: 0px; } thead { display: table-header-group; } tfoot { display: table-footer-group; } table { page-break-after: auto; } tr { page-break-inside: avoid; page-break-after: auto; } tr td { page-break-inside: avoid; page-break-after: auto; } html{margin:40px 50px} } /*# sourceMappingURL=maps/main.css.map */ 
  </style>

Why is it now breaking once converted to pdf with the latest release? Do we need to make any sort of changes?