samuel toh
samuel toh

Reputation: 7076

Why float not working in laravel dompdf?

I use Laravel 5.3

I use :

"barryvdh/laravel-debugbar": "^2.3",

"barryvdh/laravel-dompdf": "^0.7.0",

"dompdf/dompdf": "0.7.x@dev",

I get from here : https://github.com/barryvdh/laravel-dompdf

In config\dompdf.php, I set :

"DOMPDF_ENABLE_CSS_FLOAT" => true,

In my html pdf, I try :

<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
        <title>Test</title>

        <style type="text/css"> 

            body {  
                font-family: "Arial", Helvetica, sans-serif !important;
                font-size: 9px;
                margin-bottom: 100px;
            }
            .container {
                background:#fff;
                overflow:auto;
            }

            .left {float:left;}
            .right {float:right;}

        </style>


    </head>
    <body>
        <div class="container">
            <div class="left">Float left</div>
            <div class="right">Float right</div>
        </div>
    </body>
</html>

The float not working

How can I solve it?

Update :

The result of pdf is like this :

enter image description here

Upvotes: 2

Views: 3825

Answers (2)

한원우
한원우

Reputation: 21

You should use the following.

.container{
    ...
    display : block;
 }

Upvotes: 1

saravanan
saravanan

Reputation: 145

Use

display: inline-block;

instead of float.

I use the older version of dompdf in my project. I enable DOMPDF_ENABLE_CSS_FLOAT true in dompdf_config.custom.inc file. But the float result is overlapping and distorted.

The inline-block is the new and better way than using float left every time. Visit the following w3school link to more info. CSS Layout - inline-block

Upvotes: 1

Related Questions