wicked_pdf and wkhtmltopdf page size issue

ruby-on-rails-3 ruby-on-rails-plugins wkhtmltopdf

11,084

Solution 1

If you are floating your page container, then it won't work. I had the exact same problem and once I removed the floating pro.

So your page container should be:

.page {
display: block;
clear: both;
border: 2px solid #FF0000;
page-break-after: auto;}

Because the inline-block is just like floating it left.

Solution 2

Try putting in your css

@media print
    { .page {
    display: inline-block;
    clear: both;
    border: 2px solid #FF0000;
    width: 210mm;
    height: 297mm;
    page-break-after: auto;
 }
}

Also make sure you add media="all" if you are referencing external stylesheet:

<link href="/stylesheets/scaffold.css?1304060088"
      media="all" rel="stylesheet" type="text/css">

11,084

Author by

Nazar Hussain

I am an experienced developer, programmer and technical designer. I am skilled in utilizing all facets of web design and development including Ruby on Rails, PHP, ASP.NET, Flex, Flash, Action Script, ASP, Apache, IIS, MySQL Server, SQL Server, advanced accessible web development using HTML and CSS, JavaScript, VBScript, VBA, XML and CGI implementation. I have extensive knowledge of the Adobe CS3 suite. I possess a strong programming and development background with knowledge of all aspects of overseeing and developing projects including initial design, programming, implementation and user-support - primarily achieved utilizing contemporary web and programming technologies. I have an excellent command of English technical writing, including exemplary grammar skills and a meticulous attention to detail. I continually strive to ensure high standards are met and consistency is maintained throughout an entire project. I have also excellent command in graphic designing. Designing remains my hobby all from my child hood, so still I am in touch with it and adding some professional touch to my hobby, and adding some creative touch to my profession. Complete commitment to a project is given to ensure successful completion.

Updated on June 27, 2022

Comments

Nazar Hussain almost 2 years

I used these settings

WickedPdf::config = {
    :layout           => 'application.pdf.html', # use 'pdf.html' for a pfd.html.erb file
    :wkhtmltopdf      => '/bin/wkhtmltopdf', # path to binary
    :orientation      => 'Portrait', # default , Landscape
    :page_size        => 'A4',
    :dpi              => '300',
    :print_media_type => true,
    :no_background    => true,
    :margin           => {:top    => 0, # default 10 (mm)
                          :bottom => 0,
                          :left   => 0,
                          :right  => 0},

}

and set the body style to

body {
    margin: 0;
    padding: 0;
    background-color: #FFF;
    width: 210mm;
    height: 297mm;
}

and a div of class .page

.page {
    display: inline-block;
    clear: both;
    border: 2px solid #FF0000;
    width: 210mm;
    height: 297mm;
    page-break-after: auto;
}

but when the pdf is created, the .page divs are almost half of the pdf page.

Thanh over 10 years

'Because the inline-block is just like floating it left.' this save me a lot of time :D, thanks you.
Carlos Morales about 10 years

Here , talking from the future =) , well thanks this only works when is Portrait , can you do it using Landscape? What do I need to add?