JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="https://cdn.datatables.net/1.10.10/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.10.10/js/dataTables.bootstrap.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.1.0/js/dataTables.buttons.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.1.0/js/buttons.bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js"></script>
<script src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/pdfmake.min.js"></script>
<script src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/vfs_fonts.js"></script>
<script src="https://cdn.datatables.net/buttons/1.1.0/js/buttons.html5.min.js"></script>
<script src="https://cdn.datatables.net/buttons/1.1.0/js/buttons.print.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/1.10.10/css/dataTables.bootstrap.min.css">
<link rel="stylesheet" href="https://cdn.datatables.net/buttons/1.1.0/css/buttons.bootstrap.min.css">
<div id="beforedatatable" style="margin:0px;">
						<div style="">
							<h4 style="text-align:center;margin: 0; line-height: 1.428571;" class="modal-title">Company name</h4>
				   <div class="prtnrow">
							   <div class="prtncolumn">
								  <span style="text-transform: uppercase;" class="prnt_contractname"></span>
								  <span class="prnt_branchname">dsfdsf</span>
								  <span class="prnt_branchcity">sdfdsf</span>
								  <span class="prnt_contractsubject">dfdsfdsf</span>
								  <span class=""><b>Dear sir,</b></span>
							   </div>
							</div>
							<span class="prnt_contractreference" style="">ddsjfhgdsjfgdsjfgjdshgf</span>
					 
					</div>
				</div>
<table id="example" class="table table-striped table-bordered" cellspacing="0" width="100%">
        <thead>
            
   ...

CSS

.prtncolumn {
     float: left;
     padding-left: 8px;
	 display: grid;
	
    /* Should be removed. Only for demonstration */
}
.prtnrow{
	 white-space: pre-line;
}


.printpdfschedule{
	float: left;
    padding: 0px 13px 2px 12px;
}

JavaScript

var table = $('#example').DataTable();
 
 var buttons = new $.fn.dataTable.Buttons(table, {
     buttons: [
       'pdfHtml5'
    ]
}).container().appendTo($('#beforedatatable'));