Làm việc với css nổi trong html2pdf

Question

Tôi đang sử dụng phao để định vị 2 div bên cạnh nhau.

<a href="printbox.php">print</a> 
<?php ob_start(); ?> 
<style> 
    #sidedish{ 
     float: left; 

     border: 1px solid black; 
     width: 100px; 
     height: 100px; 
    } 
    #maindish{ 
     float: right; 
     width: 200px; 
     border: 1px solid black; 
     height: 100px; 
     text-align: center; 
    } 

    #container{ 
     width: 304px; 
     height: 100px; 
     border: 1px solid black; 
    } 
</style> 

<div id="container"> 
<div id="sidedish"></div> 
<div id="maindish"><div id="box">name</div></div> 
</div> 
<?php $_SESSION['boxes'] = ob_get_contents(); ?> 

Đây là những gì printbox làm, nó chỉ làm cho các dữ liệu đệm vào một pdf, nhưng bằng cách nào đó nổi đã được thiết lập đã bị mất trong quá trình này.

<?php require_once('html2pdf/html2pdf.class.php'); ?> 
<?php 
$html2pdf = new HTML2PDF('P', 'A4', 'en', true, 'UTF-8', array(0, 0, 0, 0)); 
$html2pdf->writeHTML($_SESSION['boxes']); 

$html2pdf->Output('random.pdf'); 
?> 

Nó hoạt động tốt trên html:

nhưng khi tôi bấm vào in nó quay như thế này:

Bất kỳ ý tưởng gì vấn đề là?

Answer 1

Phát biểu từ kinh nghiệm cá nhân, tôi sẽ nói kiểu dáng đầu ra của HTML2PDF là, tốt nhất, khoa học ma thuật huyền bí đen. Lý do chính của việc này là:

• Lớp chỉ hỗ trợ một (tương đối nhỏ) tập hợp con của phong cách CSS & selectors tương thích
• CSS được cung cấp tài liệu
• PDF là không thể để gỡ lỗi liên quan đến việc nhập HTML

Để công bằng, đây không chỉ là vấn đề cho HTML2PDF nhưng also for the TCPDF that HTML2PDF uses.

Nó thể được có thể là HTML2PDF, là chỉ là một hầu-zero-thiết lập, nhanh chóng & giao diện thay thế dễ dàng cho các TCPDF, cắt giảm hỗ trợ CSS hơn off - nhưng tôi chắc chắn rằng thậm chí TCPDF sẽ không hỗ trợ float đúng cách.

Cách giải quyết tốt nhất mà bạn có thể sử dụng là gửi divs nổi của bạn để nineties:

<table> 
    <tr> 
     <td><div class="float"> ... </div></td> 
     <td><div class="float"> ... </div></td> 
    </tr> 
</table> 

Bạn cũng có thể che giấu sự ngượng ngùng này từ HTML công cộng:

<?php 
    $isPdf = (/* condition that tells us we're outputting PDF */) ? true : false; 
    if ($isPdf) { 
     echo "<table><tr><td>"; 
    } 
?> 
<div class="float"> ... </div> 
<?php 
    if ($isPdf) { 
     echo "</td><td>"; 
    } 
?> 
<div class="float"> ... </div> 
<?php 
    if ($isPdf) { 
     echo "</td></tr></table>"; 
    } 
?> 

Answer 2

Bạn có thể xem tài liệu nhanh trực tuyến bằng tiếng Pháp tại đây: http://demo.html2pdf.fr/examples/pdf/about.pdf

('Les float ne sont gérés que pour balise IMG')

= Nổi chỉ được xử lý để đánh dấu img của lớp học.

Thuộc tính css được xử lý cũng được liệt kê trong tài liệu.