I’ve kept a Javascript function printthis()
for printing purpose that prints everything in the div id printthis
except what is given with the class d-print-none
. The code works good in the opening page, the page before printing. But Upon clicking print, the word-break given for the div class address2
& ml-auto address
are not working.The word-break will work fine if the address value comes in the div ml-auto address
is a small string. i wanted the word-break to work good for the address block like it appears in the page before printing. How can i fix this?Can i get some help?
i tried assigning a width like for the address block ,ie, div ml-auto address
.But it is also not working.
https://jsfiddle.net/1peoqsgc/2/
The full script & css is availble in the above link.
<div id="printthis">
<div class="container-fluid">
<div id="ui-view" data-select2-id="ui-view">
<div class="card">
<style>
@media print {
.address {
float: right;
word-wrap: break-word;
}
.address2 {
float: left;
word-wrap: break-word;
}
}
</style>
<div class="card-body">
<div class="row mb-4">
<div class="col-sm-4 address2">
<div style="width: 405px;"> abcdfjsdfjfd firi,iiii, 29978876, dfdgfdgdhfghfghiiiiiiiiiiiiiiiiiii</div>
</div>
<div class="col-sm-4 ml-auto address">
<div>kkkkkkk i u ppppp 112233444, mkmmkkkl, 5675675675, lkljh po</div>
</div>
</div>