• 22 Dec 12
  

  zfade3

  print css pdf

• 12 Jun 12
  

  Edward Castillo

  css design webdesign

• 04 Jan 12
  

  Isidro Vila Verde

  @page { size: 7in 9.25in; margin: 27mm 16mm 27mm 16mm; }

  books pdf printing html print css

• 29 Nov 11
  

  Bruno Bichet

  css print design pdf book html books webdesign

• 27 Oct 11
  

  Tamás Hajas

  css print design book pdf html webdesign css3 print stylesheet

• 15 Jul 11
  

  Raimon Lapuente

  llibre book css formatting

• 07 Apr 11
  

  Thomas Widmann
• 06 Apr 11
  

  Masiar Ighani

  knook

• 15 Mar 11
  

  cssprint

• 14 Jan 11
  

  Steinar Rune Eriksen

  pdf

• 20 Jun 10
  

  Gerbert Olive

  pdf princexml html to pdf

• 08 May 10
  

  Don Ryan

  A List Apart article by Håkon Wium Lie (Opera) and Bert Bos on using CSS to style a book format.

  css alistapart typography layout

• 10 Mar 10
  

  Thierry Michel

  css print

• 19 Feb 10
  

  Cinta Màdico

  CSS microformats print css3 pdf book

• 29 Jan 10
  

  Richard Cooper

  css print design books pdf html

• 28 Jan 10
  

  paulalbert
• 26 Oct 09
  

  Penny Wheeler

  2read

• 22 Oct 09
  

  Paulo Gaspar

  css print html pdf howto article tutorial

• 21 Oct 09
  

  debora pinheiro

  design printing books css

• 11 Sep 09
  

  print pdf css xml

• 18 Aug 09
  

  mgraber

  css print

• 28 Jun 09
  

  Helen Pidoulas

  A List Apart Articles Printing Book with CSS Boom NED24 NED12 NED11

• 05 Mar 09
  

  Eric Alvarado

  print css

• 02 Jan 09
  

  Thomas Keller

  webdesign tips css book typography xml

• 16 Dec 08
  

  Qi D

  new_tech multimedia

• 14 Nov 08
  

  Mel Karlik

  printing

• 21 Oct 08
  

  Gary Edwards

  HTML is the dominant document format on the web and CSS is used to style most HTML pages. But, are they suitable for off-screen use? Can CSS be used for serious print jobs? To find out, we decided to take the ultimate challenge: to produce the next edition of our book directly from HTML and CSS files. In this article we sketch our solution and quote from the style sheet used. Towards the end we describe the book microformat (boom!) we developed in the process.

  html-css-svg hakon-wium-lie prince wikiword list-apart

• 01 Oct 08
  

  An article about boom! - a microformat for books. Create the book in HTML/CSS and publish to CSS using Prince

  css design howto books web printing publishing

• 29 Jul 08
  

  osantana

  authoring article

• 23 May 08
  

  Steve Thomas

  A microformat that eases the transition from page to print with CSS and HTML

  css ebook print

• 19 May 08
  

  Felix R.

  print pdf css html book del.icio.us

• 02 May 08
  

  elliot harrison roberts

  Printing a Book with CSS: Boom!

  print CSS

• 13 Apr 08
  

  bkeepers

  css print html pdf

• 31 Mar 08
  

  Julie Whitehead

  great resource to print a book from a web page

  css print books pdf

• 21 Mar 08
  

  l.m orchard

  books print publishing writing

• 21 Feb 08
  

  raphaeldamico

  css

• 19 Feb 08
  

  Sean O'Halpin

  Print a book using Prince xml-pdf and boom microformat

  prince css print pdf boom microformat

• 08 Feb 08
  

  brockmoeller

  Headers and footers Here is an example: @page :left { @top-left { content: "Cascading Style Sheets"; } }

  Bookmarks CSS print

• 09 Jan 08
  

  Jérémie Pottier

  css design

• 07 Jan 08
  

  Stephanie Booth

  print css design

• 31 Dec 07
  

  Rob McCormack

  books css html pdf print

• 20 Dec 07
  

  rhskarpinski

  css book.printing docbook.printing

• 29 Nov 07
  

  printing pdf css web

• 

  delicious printing pdf css web

• 23 Nov 07
  

  Olgen Morten

  generator printing css for:martin.karlsch deli

• 10 Nov 07
  

  zeroeth

  css pdf convert html

• 04 Nov 07
  

  jeanjordaan

  Can CSS be used for serious print jobs? To find out, we decided to take the ultimate challenge: to produce the next edition of our book directly from HTML and CSS files. In this article we sketch our solution and quote from the style sheet used.

  article book css print design howto pdf for:fjordaan

• 10 Oct 07
  

  Harjeet Singh

  contentstore pdf xml

  • Printing a Book with CSS: Boom!

     

    by Bert Bos, Håkon Wium Lie

      
     
    • Published in: CSS, HTML and XHTML |
     
    •   

      Discuss this article »

      
      
     

      

      

    HTML and CSS, two of our favorite acronyms, are normally associated with web pages. And deservedly so: HTML is the dominant document format on the web and CSS is used to style most HTML pages. But, are they suitable for off-screen use? Can CSS be used for serious print jobs? To find out, we decided to take the ultimate challenge: to produce the next edition of our book directly from HTML and CSS files. In this article we sketch our solution and quote from the style sheet used. Towards the end we describe the book microformat (boom!) we developed in the process.

       

    The studious reader may want to fetch a sample HTML file, sample style sheet, as well as the PDF file generated by Prince. The PDF file is similar to the one we sent to the printer. We encourage you to base your own book on the sample file and tell us how it goes.

       

    Print vs. pixel

       

    A printed book has many features not seen on screens. There are page numbers, headers and footers, a table of contents, and an index. The content must be split into pages of fixed size, and cross-references within the book (for example, “see definition on page 35”) must be resolved. Finally, the content must be converted to PDF, which is sent to the printer.

       

    Web browsers are good at dealing with pixels on a screen, but not very good at printing. To print a full book we turned to Prince, a dedicated batch processor which converts XML to PDF by way of CSS. Prince supports the print-specific features of CSS2, as well as functionality proposed for CSS3.

       

    CSS2

       

    CSS2 has a notion of paged media (think sheets of paper), as opposed to continuous media (think scrollbars). Style sheets can set the size of pages and their margins. Page templates can be given names and elements can state which named page they want to be printed on. Also, elements in the source document can force page breaks. Here is a snippet from the style sheet we used:

       

    @page {   size: 7in 9.25in;   margin: 27mm 16mm 27mm 16mm; }

      

    Having a US-based publisher, we were given the page size in inches. We, being Europeans, continued with metric measurements. CSS accepts both.

       

    After setting the up the page size and margin, we needed to make sure there are page breaks in the right places. The following excerpt shows how page breaks are generated after chapters and appendices:

       

    div.chapter, div.appendix {   page-break-after: always; }

      

    Also, we used CSS2 to declare named pages:

       

    div.titlepage {   page: blank; }

      

    That is, the title page is to be printed on pages with the name “blank.” CSS2 described the concept of named pages, but their value only becomes apparent when headers and footers are available. For this we have to turn to CSS3.

       

    CSS3

       

    The CSS Working Group has published a CSS3 Module for Paged Media. It describes additional functionality required for printing. We will start by looking at running headers and footers.

       

    Headers and footers

       

    Here is an example:

       

    @page :left {   @top-left {     content: "Cascading Style Sheets";   } }

      

    The example above puts a string (“Cascading Style Sheets”) in the top left corner of all left-hand side pages of the book. All pages? Not quite. A subsequent rule removes the header from pages named “blank”:

       

    @page blank :left {   @top-left {     content: normal;   } }
• 04 Aug 07
  

  ellenm1

  deliciousImport paged_media pdf book css css3

• 19 Jul 07
  

  Murty BVNS

  book css del.icio.us imported print

• 30 Jun 07
  

  Hans Henderson

  web_design self-publishing dtp book paper css html pdf

• 11 Jun 07
  

  kabs

  css

• 25 Apr 07
  

  we decided to take the ultimate challenge: to produce the next edition of our book directly from HTML and CSS files.

  css html edition livre impression microformat

• 11 Mar 07
  

  Sandy Kemsley

  Using HTML and CSS to create a printed book.

  blogging books

• 25 Feb 07
  

  Gary Benner

  Web Design

• 14 Feb 07
  

  Steve Radman

  book print css

• 01 Feb 07
  

  Sunny Ripert

  css print design html typography standards books pdf howto ebook interesting

• 30 Dec 06
  

  Christen Bouffard

  css document-control print webdev

• 22 Dec 06
  

  Paul Stewart

  novel css html

• 14 Dec 06
  

  print

  css design html

• 09 Nov 06
  

  Manuel Polo

  css design print books html pdf HowTo Programming publishing impresión Communication libros media paper tutorial ideas interesting layout printing Programación development diseño document w3c standards webStandards webdev webdesign desarrollo typography

• 24 Oct 06
  

  Vladislav Zlobin

  microformat css programming articles

• 07 Oct 06
  

  Serise Lange

  alistapart books css design development imported:del.icio.us print-design

• 19 Sep 06
  

  Fogday Studios

  Can CSS be used for serious print jobs? To find out, we decided to take the ultimate challenge: to produce the next edition of our book directly from HTML and CSS files. In

  css bookarts

• 04 Sep 06
  

  Oliver Gassner

  buch layout css 2try 2do

• 01 Aug 06
  

  dan

  howto procude a book wusing Prince formatter and CSS

  xml html howto CSS design pdf commercial media format

• 19 Jul 06
  

  shireen

  design print web

• 08 Jul 06
  

  Ludovico Magnocavallo

  css tipography delicious

• 28 Jun 06
  

  Michael Montgomery

  books css tutorial imported

• 24 Jun 06
  

  haraldgroven

  The inventor of CSS writes about how to format a long text with CSS to make it suited for printing.

  CSS publishing fromDelicious

• 21 Jun 06
  

  organised

  design geek gb book publishing css

• 06 Jun 06
  

  Xavier Badosa

  HTML and CSS, two of our favorite acronyms, are normally associated with web pages. And deservedly so: HTML is the dominant document format on the web and CSS is used to style most HTML pages. But, are they suitable for off-screen use? Can CSS be used for

  css print

• 

  garret

  CSS XML

• 16 May 06
  

  numa1985 manu
• 15 May 06
  

  Rodney Greenfield

  CSS design html layout print web XHTML xml for:dwillis

• 20 Apr 06
  

  Luis A

  Explanation on how to produce a book usinh HTMl and CSS.

  publication css pdf book delicious

• 22 Feb 06
  

  Michael Hamann

  book boom buch css html pdf xhtml

• 10 Feb 06
  

  Kevin Ridgway

  css print design books howto html

• 06 Feb 06
  

  webdev css

• 20 Jan 06
  

  Franjo Pehar
• 03 Jan 06
  

  Chris Jobling

  Can CSS be used for serious print jobs?

  article blog book howto html layout paper w3c web css

• 01 Jan 06
  

  Nick DeNardis

  css print design books howto html pdf

• 31 Dec 05
  

  David Eyk

  html publishing microformat css howto printing pdf book author technique

• 20 Dec 05
  

  r l

  A great article about printing a book using just HTML and CSS

  development

• 

  lotsoflife

  css print books pdf html design printing book

• 16 Dec 05
  

  Bruce Wayne

  web_design css html print design

• 14 Dec 05
  

  mustafa tulu

  css design howto

• 08 Dec 05
  

  Sergio Gómez

  (en) Impresión de un libro mediante CSS

  css ebook xhtml html epr

• 06 Dec 05
  

  daniel sinclair

  blogging

• 05 Dec 05
  

  dalmaso

  css print

• 

  Patrick Houlihan

  css book books design html

• 

  Jonathan Key

  CSS styling for books. A nice homespun solution.

  books publishing web

• 04 Dec 05
  

  robert179

  CSS

• 

  farmando

  blog reference tips

• 

  francesco armando

  blog reference tips

• 03 Dec 05
  

  H C
• 

  skateface

  css print design howto

• 

  sureshl

  Technology

• 02 Dec 05
  

  Jason Anderson

  css webdev

• 

  Kevin Painting

  CSS

  • HTML and CSS, two of our favorite acronyms, are normally associated with web pages. And deservedly so: HTML is the dominant document format on the web and CSS is used to style most HTML pages. But, are they suitable for off-screen use? Can CSS be used for serious print jobs? To find out, we decided to take the ultimate challenge: to produce the next edition of our book directly from HTML and CSS files. In this article we sketch our solution and quote from the style sheet used. Towards the end we describe the book microformat (boom!) we developed in the process.

Page Comments

• 
  Christen Bouffard on 2006-12-30
  Concept for printing docs using css

Would you like to comment?

Join Diigo for a free account, or sign in if you are already a member.